- ベストアンサー
全体のフォントサイズをコントロールする方法
スタイルシートを作り、その中に body { font-size: 82%; } と書いてリンクさせれば、そのページに表示されるフォントはすべて82%の大きさになると聞いたのですが、まったくきかないのです。なにか間違っていますでしょうか？ 他のサイトでもそのようにしているところがあったのですが、なにか指定が足りないですか？ 教えてください。宜しくお願いします。
- みんなの回答 （5）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
補足見ました。 ページ内がすべてテーブルで構成されている場合でしたら、bodyに対するフォントサイズの指定を外し、テーブル内のテキストが入る部分に対してフォントサイズの指定をするのが良いかもしれません。 その場合、tableにフォントサイズを指定するより、td要素・th要素などに対してフォントサイズを指定する方が良いようです。 そうすれば、入れ子のテーブルに対して相対指定が重複して適用される事を、一応は回避できるようです。 平たく言えば、bodyに対してのフォントサイズ指定は記述せず、以下のスタイル指定をしてみてください。 td, th{ font-size: 82%;} もしテーブル外にもテキストがあるのであれば、bodyに対してではなく、そのテーブル外で、テキストを含むp要素なりdiv要素なり、li要素なりに、スタイルシート指定を適用するように書き加えればよいでしょう。 (例： p, div, td, th{ font-size: 82%;}) DOCTYPE宣言についてですが、これは文書の内容を宣言する記述になります。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 等のような記述が、それです(上はHTMLのDOCTYPE宣言の一例です)。 最近のブラウザでは、この宣言の書き方によって、CSSの解釈の仕方を変更する、DOCTYPEスイッチと呼ばれる機能が搭載されているものがあります。 そのため、DOCTYPE宣言の書き方で、CSSの解釈の仕方が変わります。 そのあたりの話の詳細については、「DOCTYPE スイッチ」をキーにして検索をかけてみると、いくつか参考になるページがでてくると思います。 参考URLに、そのうちの一つを紹介しておきます。 ただ、標準モードと後方互換モードとでは、CSSの解釈の仕方が大きく異なりますので、表示モードを変えることでCSSの記述自体を全体的に修正する必要がでるかもしれません。 ですので、ご質問の案件について、DOCTYPE宣言を修正する事で簡単に解決できると言い切れない可能性が残りますね。 前回はその点について触れていませんでした。すみません。 たびたび失礼しました。
その他の回答 (4)
- RAPTsong
- ベストアンサー率42% (74/175)
簡単な方法。 body, td { font-size:82%; } とか。
お礼
ありがとうございました。もうお一方にもご指摘を受けましたが、tableの中では適応されないということを知りませんでした。勉強になりました！
- RAPTsong
- ベストアンサー率42% (74/175)
ちなみに、「どの部分」を見て、「適用されていない」と判断されたのでしょうか？ 例えば、<table>タグ内など、ブロック要素の中について、<body>タグのスタイルの 適用範囲外の場合などがあるかと思うのですが。
いくつか原因が考えられますが… まず、最も基本的な確認ですが、HTMLソースの記述ミスがないかを確認してみてください。 head内で<link href="hoge.css" rel="stylesheet" type="text/css">のように指定してあるでしょうか。 hrefの相対パスの誤りなどはありませんか? それがない場合は、もしかしてテーブルでレイアウトをしていないでしょうか。 表示モードが後方互換モードになっている場合、body要素にフォントに関係するスタイルシートを指定しても、その指定がテーブルには継承されないケースがあります。 その場合は、表示モードを標準モードにするようにDOCTYPE宣言を行うか、body要素に対するフォント指定だけでなく、body要素に指定したのと同じフォント指定をtable要素に対しても適用するようにスタイルシートを記述すれば、一応解決できると思います。 もしtableでレイアウトを行っているのが原因で、上の説明の後方互換モード・標準モードについてや、DOCTYPE宣言などの用語がわからない場合は、 table{ font-size: 82%;} と言う指定をスタイルシートに追加するのが、簡素な対策になるでしょう。 おそらく、このあたりが原因なのではないかと推測しますが…見当違いでしたら、ごめんなさい。 参考になれば…
補足
ありがとうございます。確かに全体をテーブルでレイアウトしていました。そこで、教えていただいた通り cssの中に table{ font-size: 82%;} を入れてみたのですが、今度はbodyと関係しているのか、どうも82%のさらに82%になってしまったようで、テーブル内がかなり小さくなりました。そして、入れ子にしてあったテーブルの中身はさらにその82%になったようです。なにか回避方法はありますか？ 調べたのですが、DOCTYPE宣言が把握できないでいます。簡単に記述する方法などありますか？
- RAPTsong
- ベストアンサー率42% (74/175)
> リンクさせれば 具体的にどうされたのでしょうか？ アンカータグではなく、ヘッダ内でリンクタグでCSSとして記述されたのでしょうか？
補足
ありがとうございます。具体的に書きますと、 xxx.css を作り、 <head>タグの中に <link href="xxx.css" rel="stylesheet" type="text/css"> と記述しました。
お礼
たびたびありがとうございました。スタイルの指定に対して勉強になりましたし、おまけにDOCTYPEも非常に奥が深いということがわかりました。あまり気にしないでいた部分だったのですが、勉強しなくてはいけませんね。ご丁寧な解説を本当にありがとうございました。