- ベストアンサー
表をCSSで指定する方法
表をCSSで指定する方法 表をスタイルシートで指定することはできますか？ 下の記述を何百ページものhtmlにおこなった場合、widthを640に変更したい場合など、手作業で変更しなければならず煩雑です。 <TABLE cellSpacing=0 cellPadding=10 width=600 border=0> スタイルシートなどを使うことはできませんか？ 背景は、selene_plさんに教えていただいたようにスタイルシートを使いました。おかげさまで、色の変更は複数ページにわたり、一気にできるようになりました。 →BODY{ background-color : #cecfff; } というcolor.cssファイルをつくりました。 →htmlページの <head>～</head>の中に、 <link rel="stylesheet" type="text/css" href="color.css"> を埋め込みました。 表についてもこのようなことはできませんか？長年の懸案です。
- grizzly
- お礼率81% (895/1101)
- その他（プログラミング・開発）
- 回答数3
- ありがとう数2
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
>TABLE{cellSpacing:0; cellPadding:10; width:600; border:0; bgcolor:#FFFFFF;} >→結果は、background-color の#FFFFCE(黄色)がページ全体にわたって、表示されるだけです。表と表の背景は表示されません。 確認です。 表の罫線もスタイルシートを使って表示させたいということでしょうか。 私にはできませんし、スタイルシートは本来そのような使い方が できないと思います。 ですから、表の罫線はHTMLで事前に記述しておく必要があると思います。 その上で、表の幅や背景色を変更するために 外部ファイルを使ってスタイルシートを定義すればよいと思います。 TABLE{ width : 600px;border-width : 0px 0px 0px 0px; padding-top : 0px;padding-left : 0px;padding-right : 0px; padding-bottom : 0px; background-color : #FFFFFF;} こちらの TABLE{cellSpacing:0; cellPadding:10; width:600; border:0; bgcolor:#FFFFFF;} 記述方法が異なっていると思いますので 下記ＵＲＬを参考にしていただければと思います。
その他の回答 (2)
- onimotsu
- ベストアンサー率36% (279/758)
外部ファイルを使ったやり方ですね。 （最初に”外部ファイル”と記載しましょう） TABLE{ width : 600px; border-width : 0px 0px 0px 0px; padding-top : 0px; padding-left : 0px; padding-right : 0px; padding-bottom : 0px; } これをcolor.cssに書き込めばよいと思います。 お試しください。
補足
うまくいきません。 →<head>と</head>の間に下を挿入しました。 <link rel="stylesheet" type="text/css" ref="color.css"> →また、color.cssを下のように記述しました。 BODY{ background-color : #FFFFCE; } TABLE{cellSpacing:0; cellPadding:10; width:600; border:0; bgcolor:#FFFFFF;} →結果は、background-color の#FFFFCE(黄色)がページ全体にわたって、表示されるだけです。表と表の背景は表示されません。 どこがいけないのでしょうか？ よろしくおねがいします。
- osamuy
- ベストアンサー率42% (1231/2878)
表についての一般的なスタイルを、クラスとして定義してあげる、ってのは。 こんな風に： ..TBL_GENERIC { border-collapse:collapse; border-spacing:0px; border:thick solid black; } .TBL_GENERIC TD { color:green; backgrond-color:#FEE; padding:0.5ex 1ex; border-width:1px 0px; border-style:solid; border-color:gray; } </style> </head><body> <table class="TBL_GENERIC"> <tr><td>Test<td>data <tr><td>foo<td>peko poko </table> </body> もし求めるものが、同じデータの表を挿入する事だったら、 ・要素OBJECTで、表HTMLを埋め込む。 ・要素IFRAMEで、リンクする。 ・SSIでインクルードする。 ・ローカルで、表HTML挿入を一括処理する。 ――とか。
お礼
ありがとうございます。 今後の課題とさせていただきます。
お礼
できました。 本日の天気のようにすっきりしました。 ありがとうございます。 感謝しております。 次の課題は、 1列2段の定義の仕方です。 項をあらためて質問させていただきます。