- ベストアンサー
CSSでID等が何もないtableブログパーツを編集したい
steel_grayの回答
- steel_gray
- ベストアンサー率66% (1052/1578)
<div id="sample1"> テーブル </div> <div id="sample2"> テーブル </div> って構成だと、 #sample1 table { ～ } #sample2 table { ～ } あるいは #sample1 td { ～ } みたいな書き方で id="sample1"の子孫のtableとid="sample2"の子孫のtable id="sample1"の子孫のtd、 に対して作用するスタイルを書く事ができます。（子孫セレクタ） 「セレクタ」について知っているとidやclassを無用に付けなくて済む事がありますので一度調べておくといいかも。 http://hp.vector.co.jp/authors/VA022006/css/selector.html
関連するQ&A
- tableの外枠をCSSで表示させない方法
HTMLで作ったテーブルの外枠の縦線をCSSで表示させないようにしたいのですが可能でしょうか？ HTMLはさわらずにできる限りCSSでやりたいと思い、いろいろ試してみましたがうまくいきませんでした。 線種はsolidを使いたいです。 よろしくお願いいたします。 <html> <head> <title>css table</title> <style type="text/css"> <!-- table.sample { width:550px; height:auto; border:solid 1px; border-collapse:collapse; border-left:none; border-right:none; } .sample th { width:100px; border:solid 1px; } .sample tr { border:solid 1px; } .sample td { border:solid 1px; } --> </style> </head> <body> <table class="sample" frame="hsides"> <tr> <th scope="row"> </th> <td> </td> <td></td> <td></td> </tr> <tr> <th scope="row"> </th> <td> </td> <td></td> <td></td> </tr> <tr> <th scope="row"> </th> <td> </td> <td></td> <td></td> </tr> <tr> <th scope="row"> </th> <td> </td> <td></td> <td></td> </tr> <tr> <th scope="row"> </th> <td> </td> <td></td> <td></td> </tr> </table> </body> </html>
- ベストアンサー
- CSS
- CSSでテーブルを表示させるには
CSSでテーブルを表示させたいのですが、やり方が分かりません。教えてください。 現在は、HTMLで以下のように記述しています。 -------------------------------------------------------- <table border="0" width="100%" cellspacing="0" cellpadding="2"> <tr> <td bgcolor="#000000">テキスト</td> </tr> </table> -------------------------------------------------------- 具体的には、クラスを指定して、<div class="table">テキスト</div> と記述したときにテーブルを表示させたいです。 回答よろしくお願いします。
- ベストアンサー
- CSS
- FireFox2.0でCSSを使ってテーブルそのものをセンタリングしたい
IE６だと #wrapper { text-align: center; } <div id="wrapper"> <TABLE border="1"> <tr><td>テキスト</td></tr> </table> </div> とやればテーブルそのものがセンタリングされるのですが、 FireFox2.0だと左に寄ったままです。 CSSを使わずに<center>で囲めばセンタリングされますが、 そうではなくてCSSを使ってやるやり方はないでしょうか？
- ベストアンサー
- HTML
- CSSの設定方法について
CSSは外部ファイルにし、十数枚あるHTMLに「div id=contents内にあるTableは全て共通のレイアウト」 となるよう下記のCSSを設定しました。 --------CSS----------------------------------------- #contents{margin-left: 70px;} #contents table{width: 650px; border: solid 1px #B1B2B2; border-collapse: collapse; margin: 15px 0px;} #contents tr, td ,th{padding: 4px; border: solid 1px #B1B2B2; border-collapse: collapse;} --------HTML----------------------------------------- <div id="contents"> <table> <tr> <th>項目</th> </tr> <tr> <td>項目1</td> </tr> </table> </div> ------------------------------------------------------- しかし、どうしても違うレイアウトにしたいTableが出てきた為、下記CSSを追加、 HTMLは<div id="contents">の部分を<div id="login">に変更したのですが 追加CSSが反映されず、id=contentsの設定が残ったままになってしまいます。 色々いじってみたのですが、どこが間違っているのやら皆目見当がつきません。 --------追加CSS----------------------------------------- #login{text-align: center; } #login table{width: 450px; border: solid 2px #666666; border-collapse: collapse;} #login tr, td ,th{border: solid 1px #666666; border-collapse: collapse;} --------HTML----------------------------------------- <div id="login"> <table> <tr> <th>項目</th> </tr> <tr> <td>項目1</td> </tr> </table> </div> 拙い文章で恐縮ですが、ご助言いただけると大変助かります。 説明不足や意味不明箇所は補足させていただきますので、どうぞよろしくお願い致します。
- ベストアンサー
- HTML
- CSS で横に並べるには
CSS 初心者です。 □□ 上記のように横に表示させたいのですがうまくいきません。 <div>で方法ないものでしょうか？ つまり <CENTER> <TABLE BORDER="1"> <TR> <TD>●</TD> <TD>■</TD> </TR> </TABLE> </CENTER> のような感じです。 ●には普通にHTMLページを ■にはフレームペーを入れたいと思っています。 cssでなくてもかまいません。フレームでも可です。 ただテーブルを中央寄せ（センタリング）にしたいんです。 よろしくお願いします。
- 締切済み
- HTML
- シンプルなコードなのにテーブルにCSSが適用されない・・・
今回思い悩んで質問させて頂く事となりました。 すごい単純に書いてるつもりなのですが テーブルに着色 （青） （赤） が適用されません。 当方、本一冊の独学でやっているので大ポカと思うので ご指摘頂ければと思います。 以下コードです。 ------------------------------------------------ <title>無題ドキュメント</title> <style type="text/css"> <!-- #blue tr {background-color:blue;} #blue td {background-color:blue;} #red tr {background-color:red;} #red td {background-color:red;} --> </style> </head> <body> <table width="200" border="1"> <div id="blue"> <tr><td> </td></tr> </div> <div id="red"> <tr><td> </td></tr> </div> </table> </body> Dreamweaver上では着色されるのですが・・・ どなたかご教授お願い致します。
- ベストアンサー
- HTML
- ＣＳＳファイルにするには２
ＨＴＭＬファイルを文章構造にし、この<table border= "1">をＣＳＳファイルでＨＴＭＬファイルに出力するためにはどうしたら良いでしょうか？お願いします。条件は、ＨＴＭＬファイルに＜div class="t3"＞ という形にし、ＣＳＳファイルにはｔ3｛｝という形にしたいことです。枠にしたいのは次のとおりであます。 <table border= "1"> <tr><td> answer1,answer2:string<b writeln( 'Are you interested in ancient ruins?') <br> end. </td></tr> </table>
- 締切済み
- HTML
- CSSで高さ100％のレイアウト
テーブルを使用せずCSSでのレイアウトなのですが フッター位置をブラウザの一番下にマージン無しで指定したいのですが出来ません。 テーブルでは <table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0"> <tr> <td valign="top">内容</td> </tr> <tr> <td valign="bottom">フッター</td> </tr> </table> というように指定していたのですが CSSでのレイアウトはHTMLを <div id="container"> <div class="content">内容</div> <div id="footer">フッター</div> </div> .CSS では #container { height: 100%; } は無効なのでしょうか？ 他のやり方でもフッターをブラウザの一番下にマージン無しでレイアウトできる方法があったら教えて下さい。
- ベストアンサー
- CSS
- 外部CSSを使ったテーブルが作りたいのですが・・・。
以前こちらで質問させて頂いて、「スタイル作りはＣＳＳで」、と教えて頂き、ＣＳＳの勉強を始めました。 早速壁に当たっていまして、お知恵を拝借したいです。 外部ＣＳＳファイルに、ul.gaibu{color:ff0000}と記すと、 ＨＴＭＬファイルに<ul class="gaibu">ここは赤で表示</ul> となる事は出来たのですが、 テーブルの場合、 外部ＣＳＳファイルにdiv#table{設定値}を記し、 HTMLに<div id=table>とすると、外部CSSの設定値が反映されましたが、 <tr>や<td>の内容をどう設定して、HTMLにどう記載すれば反映するかが分かりません。 因みに外部CSSに tr.table1 {border:1px #333333 solid; line-height:25px; padding-left:10px; paddting-right:10px; text-align:left; vertical-align:middle} と記載し、HTMLの方に <tr><td class="table1">表１</td><tr>としましたが、 CSSの内容は反映されていません。 宜しくお願い致します。
- 締切済み
- HTML
- CSSのテーブルの件で
はじめまして よろしくお願いいたします。 CSSでテーブルを作っているのですが うまくいきません 作りたいのは下記のようなテーブルです ┌───────┐ │ A │ B │ └───────┘ 点線ではなく普通の線で構いません 大きなテーブルの幅が500pxとして Aを200px Bを300px にしたいのです テーブルのIDは「table2」にしています <外部CSSの部分> #table2{border:1px solid #000000; width:500px; } #table2 th{border:1px solid #000000; width:200px; } #table2 td{border:1px solid #000000; width:300px; } <htmlの部分> <table id="table2"> <tr> <td></td> </tr> </table> 色々やってみたのですが うまく行きません 詳しい方教えて頂けないでしょうか？ どうぞよろしくお願いいたします。
- ベストアンサー
- HTML
お礼
ありがとうございます！大変助かりました！