- ベストアンサー
スタイルシート 全体と個別？
スタイルシートで table { width="100%"; }と定義しているところで、 <table>タグを書くと100%で表示されます。 これはこれで全てのテーブルタグが一律そうなって便利ですが、 特定のテーブルだけ width="100px"にしたいのですが可能でしょうか？ CSSの仕組みを理解していないのでお分かりの方教えてください。 全て一律で定義した状態で、特定のテーブル（タグ）だけ別のスタイルにしたいです。 特定のテーブルだけ<table width="100px">や <table style="width:100px">としましたが、私のミスか全体のスタイルシートの設定ままでした。
- bootx
- お礼率4% (3/70)
- HTML
- 回答数3
- ありがとう数0
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
<table style="width:100px">で良いんです。 ただ、100pxの後に「;」(セミコロン)が抜けてます。 それだけのことです ^^; <table style="width:100px;"> ↑としてください。 このスタイルを適用したテーブルだけ幅100pxになります。 確認ブラウザ IE7 FireFox
その他の回答 (2)
- leap_day
- ベストアンサー率60% (338/561)
こんにちは ＞特定のテーブルだけ<table width="100px">や <table style="width:100px">としましたが width="**"よりはスタイルの方が強いですので変わりませんが style="width:**;"であれば適用されるはずです されない場合にはスタイルは後に書かれたものが採用されるので順番が逆になっているのかもしれません(大抵<head>内に記述する) 他のやり方としては『id』『class』などを使います 『id』 <style type="text/css"><!-- table { width:100%; } #tb1 { width:100px; } --></style> <table border="1"> <tr><td> </td></tr> </table> <table border="1" id="tb1"> <tr><td> </td></tr> </table> 『class』 <style type="text/css"><!-- table { width:100%; } .tb2 { width:100px; } --></style> <table border="1"> <tr><td> </td></tr> </table> <table border="1" class="tb2"> <tr><td> </td></tr> </table>
凄く手抜きですが簡単な例を作ってみました。IE6とFirefoxで動作確認済みです。 CSS記述例 table{ width : 100% ; } .box{ width : 100px ; } HTML記述例 <table border="1"> <tr> <td>テキストテキストテキスト</td> </tr> </table> <table border="1" class="box"> ←ここが100pxにしたいテーブルです。 <tr> <td>テキスト</td> </tr> </table>
関連するQ&A
- スタイルシートのテーブル枠について
今までテーブルを利用してホームページに簡単な線を つけていました。これをスタイルシートで行うと 微妙にうまくできません・・・お助けください。 すべてＩＥで検査しております。 html従来の私の線の引き方 <table width="600" border="0" cellspacing="0" cellpadding="0"> <tr> <td bgcolor="#000000"> <img src="sps.gif" width="600" height="1"> </td> </tr> </table> 上記の表現をスタイルシートを利用してやりたいのですが 線が１pxのはずが、大きくなってしまいます。 cssを利用した記述 css部分 .index_table{ width: 600px; border:0px; border-width: 0px; margin: 0px; padding: 0px; } html部分 <table class="index_table"> <tr> <td bgcolor="#000000"> <img src="ims/sps.gif" width="600" height="1"> </td> </tr> </table> これに似たいい方法は、ないでしょうか？ 質問が、うまくまとまってなくてすみません・・・
- ベストアンサー
- HTML
- スタイルシートの書き方
HPの中に以下のようなテーブルを並べて作っているのですが、後からまとめて編集しやすいようにCSSファイルを別に作ろうと思います。 自分であれこれ試してはいるのですが、スマートな（？）スタイルシートの書き方がいまいちわかりません。 どのように指定すればいいでしょうか？ 因みに下のタグもかなり自己流な部分があるのではないかと思うので、おかしいところがあれば指摘してください。 よろしくお願いします。 ------------------------------------------------------ <table border="0" bgcolor="#000000" cellspacing="0" cellpadding="0"> <tr> <td> <table border="0" cellspacing="1" cellpadding="2" width="500"> <tr><td bgcolor="#ffffff" width="150">AAA</td><td>BBB</td></tr> </table> </td> </tr> </table>
- ベストアンサー
- CSS
- スタイルシートでのデザイン
HTMLを組む際、今までレイアウトはtableタグで組んでいたのですが、CSSで組もうと思っています。 例えば、 <table align="center"> <tr> <td colspan="2" width="500" height="80">aaa</td> <td rowspan="2" width="300" height="200">bbb</td> </tr> <tr> <td colspan="2" width="500" height="20">ccc</td> </tr> <tr> <td width="200" height="100">ddd</td> <td width="300" height="100">eee</td> </tr> </table> をスタイルシートで配置しようと思い、 <div align="center" style="width:800px"> <div style="float:left;width:500px;height:80px;background-color:#ff9999">aaa</div> <div style="float:right;width:300px;height:200px;background-color:#9ff999">bbb</div> <div style="float:left;width:500px;height:20px;background-color:#9999ff">ccc</div> <div style="float:left;width:200px;height:100px;background-color:#99ffff">ddd</div> <div style="float:center;width:300px;height:100px;background-color:#ffff99">eee</div> </div> としたのですが、センタリングされないのと、eeeの箇所がdddの隣に来ないで次の行に移ります。 うまく出来ないので、どなたか教えて下さい。お願いします。
- ベストアンサー
- CSS
- スタイルシートのwidthについて
<style type="text/css"> #hoge{border:solid 1px black;width:100px;margin:0;} </style> <div id="hoge> </div> このようにdivタグにスタイルシートをつけるとなぜか縦の幅ができてしまいます。 width:100をなくせばただの線になるのですがwidthをつけるとどうして 縦幅ができてしまうのでしょうか？ hightをつけてるのはまだしもwidthをつけただけじゃ横の長さが決まるだけで縦は0だと思ったのですが違うのでしょうか？ ブラウザはIE6で見ました。
- ベストアンサー
- HTML
- これをスタイルシートでするには
以下のことをスタイルシート（CSS＋<li>などを使って）でするにはどうしたらいいのでしょうか？ <table border="0" width="150"> <tr> <td>なんでだろう～</td> </tr> <tr> <td>CSS is cool</td> </tr> </table> よろしくお願いします。
- ベストアンサー
- CSS
- 表の作成をスタイルシートで
皆さんはHTMLで表を作成する際、どのように作成していますか？ 私はTableタグとスタイルシートを使っているのですが、これをスタイルシートのみで 作成できないでしょうか。 例えば以下のような表で、■部分は他のセルと背景色を変えます。 ■□□ ■□□ ■□□ 通常私がやっている方法は、tableタグに下記スタイル「tb01」を、タイトル部分には 「td.title」を設定を設定しています。 -----------------HTML-------------------------- <table width="100%" border="0" cellspacing="1" cellpadding="0"> <tr> <td class="title">6月7日</td> <td>text</td> <td>text</td> <td>text</td> </tr> <tr> <td class="title">6月8日</td> <td>text</td> <td>text</td> <td>text</td> </tr> </table> ---------------------------------------------------------- -----------------スタイルシート-------------------------- .tb01 {FONT-SIZE: 12px; border-collapse : collapse ; border-width : 1px 0 0 1px ; border-style : solid ; border-color : #CDCDCD ; ; width:350px; background-color:#FFFFFF; } table.tb01 td {border-width : 0 1px 1px 0 ; border-style : solid ; padding : 7px ; line-height:120%; border-color : #CDCDCD ; } td.title {background-color:#ECECEC; } ---------------------------------------------------------- スタイルシートのみでは無理でも、もっと良い方法があれば 是非教えてください。
- ベストアンサー
- HTML
- ホームページビルダーでテーブルタグにスタイルを個別に適用すると
ホームページビルダーでテーブルタグに個別にスタイルを適用すると、 <TABLE style="border-width : 1px 1px 1px 1px;border-style : solid solid solid solid;border-color : #ff6633 #ff6633 #ff6633 #ff6633;" bgcolor="#ffffff"> と長くなってしまいます、 <TABLE style="border-width : 1px;border-style : solid;border-color : #ff6633;" bgcolor="#ffffff"> このように（これで、正解なのかわかりませんが）、省略しては駄目なのでしょか？ 教えて下さい、よろしくお願いします。
- ベストアンサー
- ホームページ作成ソフト
- CSS(スタイルシート)で画像の縦サイズに合わせて、中央揃えで文字を表示したい。
CSS(スタイルシート)で画像の縦サイズに合わせて、中央揃えで文字を表示したい。 スタイルシートで、画像の縦サイズに合わせて中央揃えで文字を表示したいのですが、 どのように記述したら良いのかわかりません。 下記のようにテーブルを使えば簡単に出来るのですが、 これをスタイルシートのみで表現するにはどのように記述すればいいのでしょうか？ ちなみに左側画像の縦サイズは変わります。 よろしくお願いします。 ------------------------------------------------------------------- <html> <head> <title>CSS</title> <style type="text/css"> <!-- #waku { width: 451px; margin: 0; padding: 6px 8px 6px 8px; background-color: #008837; } --> </style> </head> <body> <div id="waku"> <table width="435" border="0" cellpadding="0" cellspacing="0"> <tr> <td width="80"><img src="hoge.gif" width="80" height="変わります"></td> <td width="355" valign="middle">あいうえおあいうえおあいうえおあいうえおあいうえおあいうえおあいうえおあいうえお</td> </tr> </table> </div> </body> </html> -------------------------------------------------------------------
- 締切済み
- HTML
- スタイルシートによる支配を抜けるには？
私の勤務先の自社サイトを、外部の業者がリニューアルしたのですが、その時にその業者が、全部で約200ページを支配する外部スタイルシートに、<TABLE>タグを使うと全て左に20pxマージンがつくような設定を入れてあるようです。 社長は、大規模なリニューアルはその業者に任せ、あとは自社で更新するという前提でこのリニューアルを行ったので、これからは私が更新して行かなければならないのですが、私はスタイルシートのことが殆どわかりません。 今、その外部の業者が設定したスタイルシートのおかげで、テーブルの中に更にテーブルを配置した場合など、内側のテーブルを競るの左にピッタリつけたいのに強制的に左側を20ピクセル空けられてしまいます。 業者が設定したスタイルシートをいじってその20pxマージンを0pxに変更してしまえば、私が今いじりたい部分は目的通りの配置で作れるのですが、もちろん、そのかわりに他のテーブルがみんな左に片寄ってしまい、これでは話になりません。 私が特例としてマージン無しで配置したいテーブルだけをスタイルシートの支配から除外するにはどうしたら良いでしょうか？
- ベストアンサー
- HTML
- テーブルタグの属性をスタイルシートで記述するには？
<table width="730" border="0" cellspacing="0" cellpadding="0"> をCSSで記述する場合に足らない部分や間違っているところを教えてください。 <table class="test"> table.test{ width: 760px; }
- ベストアンサー
- HTML
