- ベストアンサー
テーブルの文字の大きさと色を設定したい
ソースのヘッダーの中に <style type="text/css"> body{font-size:80%;color:red} </style> </head> を入れて、ページ全体のフォントを統一したいのですが、テーブルの中は適用されません。 テーブルの中は適は適用されないということは、調べていくうちにわかったのですが、 であれば、どうやったらテーブルの中のフォントをいじることができるのでしょうか？ そのコードがわかりません。
- trfbvmvjqblp
- お礼率98% (74/75)
- HTML
- 回答数2
- ありがとう数3
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
普通に table{font-size:○○%;color:#○○○○○○;} みたいにやれば良いんじゃないですか？
その他の回答 (1)
- ORUKA1951
- ベストアンサー率45% (5062/11036)
＞テーブルの中は適は適用されないということは、調べていくうちにわかったのですが そんなことはありません。 font-sizeとcolorプロパティは、継承されるプロパティです。 'color' 値: <color> | inherit ・・・【中略】・・・ 継承: yes ( http://momdo.s35.xrea.com/web-html-test/spec/CSS21/colors.html#propdef-color ) 'font-size' 値: <absolute-size> | <relative-size> | <length> | <percentage> | inherit ・・・【中略】・・・ 継承: yes ( http://momdo.s35.xrea.com/web-html-test/spec/CSS21/fonts.html#propdef-font-size ) ★サンプルです。 ★Another HTML-lint 5( http://www.htmllint.net/html-lint/htmllint.html ) のDATA入力でチェック済みのHTML4.01strictとCSS2.1のウェブ標準です。 ★タブは＿に置換してあるので戻す。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"> <head> ＿<meta http-equiv="content-type" content="text/html; charset=Shift_JIS"> ＿<title>サンプル</title> ＿<meta name="author" content="ORUKA1951"> ＿<meta http-equiv="Content-Style-Type" content="text/css"> ＿<link rev="made" href="mailto:oruka1951@hoge.com" title="send a mail" > ＿<link rel="START" href="../index.html"> ＿<style type="text/css"> <!-- body{color:blue;font-size:80%;} --> ＿</style> </head> <body> ＿<div class="header"> ＿＿<h1>タイトル</h1> ＿＿<p>このページでは・・・・</p> ＿</div> ＿<div class="section"> ＿＿<h2>見出し</h2> ＿＿<table summary ="test" border="1"> ＿＿＿<tbody> ＿＿＿＿<tr> ＿＿＿＿＿<th>あ行</th><th>か行</th><th>さ行</th> ＿＿＿＿</tr> ＿＿＿＿<tr> ＿＿＿＿＿<td>あ</td><td>か</td><td>さ</td> ＿＿＿＿</tr> ＿＿＿＿＿<td>い</td><td>き</td><td>し</td> ＿＿＿＿</tr> ＿＿＿</tbody> ＿＿</table> ＿</div> ＿<div class="footer"> ＿＿<h2>文書情報</h2> ＿＿<dl class="documentHistry"> ＿＿＿<dt id="FIRST-PUBLISHED">First Published</dt> ＿＿＿<dd>2012-08-10</dd> ＿＿＿<dt id="LAST-MODIFIED">Last Modified</dt> ＿＿＿<dd>2012-08-10 12:00:00 (JST)</dd> ＿＿</dl> ＿＿<address>© ORUKA1951 2012 - 2016 All Rights Reserved mailto:*****</address> ＿</div> </body> </html> ★ひょっとしてですが、IEが互換モードで動作している？？ スタイルシートを使用する場合、必ず標準モード--ウェブ標準で作成しないと、様々な場面でブラウザによる表示差に悩まされることになりますよ。 「HTML文書を作る場合には、この仕様における、他のDTDセットではなく strict DTD に適合する文書を作るよう推奨する。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/conform.html#h-4.1 )」 【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから 現在のブラウザの多くはCSS標準に基づいてページを表示するするようになっています。このCSSの標準に準拠して表示するモードを『標準モード』、一方過去のブラウザでも表示できるようなレイアウトで表示するモードを『互換モード』と呼んでいます。 ￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［HTMLのDOCTYPEスイッチとCSS（標準モードと互換モード）：スタイルシート（CSS）辞典 - HTMLタグボード( http://www.dspt.net/stylesheet_css/001/011.html )］より DOCTYPE 宣言を上記のように <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> と記述して、書きましょう。 ただし、 ⇒Another HTML-lint 5( http://www.htmllint.net/html-lint/htmllint.html ) でチェックしましょう。
お礼
ありがとうございました。
お礼
ありがとうございました。