- ベストアンサー
外部CSSです。テーブルにスタイルを適用したいのですが・・・。
ほとんど初心者です。 filter:Alpha(opacity=75)で、半透明にしたいんです。 個別に設定するところまではできたのですが、 外部CSSの方に記述する際、どうしたらいいのかがわかりません。 table,td,th{ font-size : 12px; style="filter:Alpha(opacity=75)"; } と、まずはやってみたのですが間違っているようで＾＾； 一応、普通のテーブルとは分けたいので ”table75”と、名前をつけたいのですが、可能でしょうか？ どう記述したらいいか、どうかアドバイスお願い致します！
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
その他の回答 (1)
- briony
- ベストアンサー率29% (323/1090)
filter: Alpha() は、テキストや画像に対して働くフィルタだと思いますので、テーブルそのものにかけるプロパティではなく、機能しないと思われます。 <table75> というタグは無理だと思います（やったことがないので、わかりませんが）。 文字等へ適用する任意のカスタムタグをつくりたい場合は、 HTMLファイルのあたまには、 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <HTML XMLNS:custom> ： と記述を加え、 ←注意）<HTML XMLNS:custom>だけでも動作します。 外部CSSには custom\:ABC { （中略） } とスタイルを記述し、 HTML内のタグとしては <custom:ABC>■■■ここにスタイルを適用させたいテキストが入る■■■</custom:ABC> のようにタグで囲みます。
お礼
おもわず、これから先はどんどんＸＭＬに入っていくのだなあと思いました＾＾； ありがとうございました！
関連するQ&A
- 外部スタイルシートがテーブル内に効かない
外部スタイルシートの設定が、テーブル内には効きません。 特に、フォントや行間を効かせたいのですが、どうしたらいいのでしょうか。 以下、大雑把ですが。 #main { float: none; margin-left: 132px; line-height: 1,5em; margin-top : 50px; } #main td, th { line-height: 1,5em; } と外部スタイルシートで指定していて、 <DIV id="main"> <TABLE cellpadding="10" background="image/003-002.gif" style="filter:Alpha(opacity=75);"> <TBODY> <TR> <TD> <H3>内容</H3> </TD> </TR> </TBODY> </TABLE> というようなテーブルを書きました。 テーブルがなければ、スタイルシートは効きます。 初歩的な質問だとは思うのですが、テーブル内に行間などを設定する方法をお願いいたします。
- ベストアンサー
- HTML
- tableを半透明にする件
tableを個別に透明にする設定などはわかったのですがテーブルの中身 の文字や画像まで透明になるのを防ぐ方法はないでしょうか？ 返信お待ちしています。 <STYLE TYPE="text/css"> <!-- TABLE{filter:Alpha(opacity=50);} --> 個別に下記タグで透明度を設定しています。 </STYLE> style="filter:Alpha(opacity=50);"
- ベストアンサー
- JavaScript
- CSSを使った丸ナンバー付きテーブルの挿入
HTMLで作成した丸ナンバー付きテーブルをスタイルシートを使って挿入しようと思っているのですが、肝心の数字の部分が真っ白になってしまいました。関係しそうなところだけ抜き出してみました。 （↓headの中に書いてある） body {background-color: white; background-image: url(dolp2.gif); color: #000000} table, td {width: 800px; border: 2px #C0C0C0 solid; border-collapse: collapse; background-color: #ffffff;} （↓body以下に書いてある） <div><Table border="0"><Tr><Td> <Table border="0" cellspacing="0" bgcolor="#009500" cellspacing="0" cellpadding="5" style="color:#ffffff;font-size:25px;font-weight:bold;width:40;filter:Alpha(opacity=100,finishopacity=0,style=2);"> <Tr><Td align="center" valign="middle"> １ </Td></Tr></Table> </Td><Td width="350"> ＝＝＝ここに文章を書いて下さい１＝＝＝ </Td></Tr> <Tr><Td> <Table border="0" cellspacing="0" bgcolor="#009500" cellspacing="0" cellpadding="5" style="color:#ffffff;font-size:25px;font-weight:bold;width:40;filter:Alpha(opacity=100,finishopacity=0,style=2);"> <Tr><Td align="center" valign="middle"> ２ </Td></Tr></Table> </Td><Td width="350"> ＝＝＝ここに文章を書いて下さい２＝＝＝ </Td></Tr> <Tr><Td> <Table border="0" cellspacing="0" bgcolor="#009500" cellspacing="0" cellpadding="5" style="color:#ffffff;font-size:25px;font-weight:bold;width:40;filter:Alpha(opacity=100,finishopacity=0,style=2);"> <Tr><Td align="center" valign="middle"> ３ </Td></Tr></Table></div> </Td><Td width="350"> ＝＝＝ここに文章を書いて下さい３＝＝＝ </Td></Tr></Table> このようなタイプのものはheadやcssにあげたほうがいいのでしょうか？ 最初はこのままbodyのなかに収めておこうかと思っていたのですが、上記のような事態になってしまったのでどうしたらいいのか困っています。 HTML初心者なので、なにとぞ宜しくお願いします。
- ベストアンサー
- HTML
- CSS idとclassをtableでつかうとき
内部cssで テーブルに装飾をしようとしていたのですが、 <style type="text/css"> <!-- table.sample td {font-size:12px;} --> </style> <table class="sample">・・・ これは有効でした <style type="text/css"> <!-- table#sample td {font-size:12px;} --> </style> <table id="sample">・・・ これは無効でした なぜでしょう？classとidはそのユニーク性のみの違いかと思っていましたが。 このような機能的な違いもあるのでしょうか。 それとも単に記述ミスですかね。。。
- ベストアンサー
- CSS
- かなり困ってます！CSSが適用されません…
WindowsXPでDreamweaverMXを使っています。 body {font-size: 12px;} .px10 {font-size: 10px;} という内容の外部スタイル「css.css」を作り、テンプレートに「css.css」を適用しました テンプレートを元にページをつくり、部分的に <td class="px10">文字列</td> といった感じで適用しました。 Dreamweaver上ではちゃんと適用されているのですが、ブラウザでみてみると文字が小さくなっていません。 bodyの12pxはブラウザ上でもちゃんと適用されています。 何がいけないのか、わかりません。どなたか解かるかたがいたらお知恵をかしてください。
- ベストアンサー
- HTML
- ＣＳＳで特定のテーブルだけに適用する記述をおしえてください。
個人でＨＰをつくっているものなのですが、 外部ＣＳＳファイルに table, td, th { border: 2px red solid; } という記述をすると すべてのページにあるテーブルに適用されてしまいました。 ある箇所のテーブルなど指定するテーブルのみに記述したい場合はどういったタグにしたらよいのでしょうか？ お詳しい方どうぞよろしくお願いいたします。
- ベストアンサー
- HTML
- thのスタイルを適用するにはどうすればいいでしょう
<table border=1 class="test1"> の部分にclassを設定するだけで thのスタイルを適用するにはどうすればいいでしょうか？ 理想としては添付画像の下のテーブルの様に thの部分だけスタイルを適用したいのですが 実際はテーブルのレコード数が多い為、 <th class="test2">を全てのthにつけるのを省略したいです。 なので、<table border=1 class="test1">の部分にthのスタイルを設定したいのですが table.test1 {font-size: 5em;} の部分はどのように記述すればいいでしょうか？ 現在の table.test1 {font-size: 5em;} だとテーブルすべてに適用されてしまいます。 理想の表示は下のテーブルで 理想のソースは上のテーブルです。 ------------------ 以下ソース <html> <head> <style type="text/css"> table.test1 {font-size: 5em;} th.test2 {font-size: 5em;} </style> </head> <body> <table border=1 class="test1"> <tr><th>No</th><td>a</td></tr> <tr><th>No</th><td>a</td></tr> </table> <br> <table border=1> <tr><th class="test2">No</th><td>a</td></tr> <tr><th class="test2">No</th><td>a</td></tr> </table> </body> </html>
- ベストアンサー
- CSS
- スタイルシートで...
スタイルシートでtableもしくはtdタグの背景色を1～100の間で透明にしたいのですが、 その記述方法を忘れてしまったのですがご存じの方いましたらタグをお教えください。 filter:Alpha(opacity=10)←のようにdiv,spanでやってみましたがだめでした。 有名なサイトなどでさがしましたがimgとfontはあるのですがtableの背景色の設定については さがすことができなかった為投稿します。
- ベストアンサー
- CSS
- テーブルをＣＳＳの外部ファイルで表示するには
テーブルをＣＳＳの外部ファイルを利用して表示させたいのですが 外部ファイルへの記入が間違っているのかうまくいきません。 作りたいテーブルは htmlで書くと <table border="1" cellspacing="0" bordercolor="#ffffff"> <tr><th colspan="4" bgcolor="#000000"> 見出し </th> </tr> <td width="125px"> 内容１ </td> <td width="125px"> 内容２ </td> <td width="125px"> 内容３ </td> <td width="125px"> 内容４ </td> </tr> </table> といった感じです。 内容１～４も中心に寄せたいです。 テーブル全体は指定できても、th,tdの指定の仕方がよくわかりません。 外部ファイルにはどう書けばいいでしょうか。 初歩的かもしれませんがよろしくお願いいたします。
- ベストアンサー
- CSS
- IEと同じようにFirefoxでもテーブルが表示されるには？
head内にスクロール非表示のタグを入れています。 http://aomi1111.sakura.ne.jp/temp/in/i106/index.htmlのような感じでノーフレームです。 IE7、IE6ではテーブルが画面の上から下まで表示されテーブル内でスクロールが出来ますが、Firefoxで見るとテーブルが画面下に飛び抜けてしまいテーブル内のスクロールが出ず、スクロール非表示にしてるので下が見れなくなってしまいます。上のサイトのように表示するにはどうすれば良いでしょうか？このテンプレートをノーフレームにしたいです。自分なりに(初心者です)いじくりすぎて原形がなくなりました。必要なさそうな(？)タグは載せていません。 ■CSS■ body,td,th{ font-size:70%; color:#444; font-family:Georgia,Verdana,Osaka,'MS P Gothic'; font-weight:normal; margin:0px;padding:0px; background:#fff url() repeat fixed; } body{text-align:center;} table{margin:auto;height:100%;} #table2{ filter:alpha(opacity=100); width:551px;height:100%; background:#fff; padding:0px 10px 0px 10px; overflow:auto; } #table3{ filter:alpha(opacity=90); background:#fff url() no-repeat; padding:0px; width:220px;height:100%; } ■top.html■ <head> <style type="text/css"> <!-- body{overflow:hidden;} --> </style> </head> <body> <★table cellspacing="0"> <tr><td> <div id="table2">左の本文</div> </td><td> <div id="table3">右メニュー</div> </td></tr> </table> </body> ★のtableを消してcssの#table内にfloat:left;margin-left:120px;等入れるとFirefoxでも表示されますが、その場合table2、table3を真ん中にこさせる方法が解りません。。。どなたか解る方がいましたらよろしくお願い致します。
- 締切済み
- HTML
お礼
ありがとうございます！ そのようにやりましたら、できました。