ホームページの文字サイズを%やemでうまく指定するにはどうすればよいでしょうか?

うまいcss設定を教えてください。

ブラウザによって表示がまちまちな気がして。pxとかでしちゃえば楽なのですが、見る人が文字サイズを変えられないので、%やemで指定して、変更したければできるようにしたいです。

回答の条件
  • URL必須
  • 1人2回まで
  • 登録:
  • 終了:2006/11/09 16:40:03
※ 有料アンケート・ポイント付き質問機能は2023年2月28日に終了しました。

回答5件)

id:HON2 No.1

回答回数220ベストアンサー獲得回数4

ポイント20pt

「相対的に文字サイズを微調整できる指定方法」は下の頁にありますが、

さらに見る人が文字サイズを変更できるのは、

絶対指定と同様に大中小などに変えるぐらいしかないと思います。(小生が知らないだけかな?)

また、文字サイズを見る人が変えられるということは、

元のレイアウトを崩してしまうことにもなります。

http://allabout.co.jp/internet/hpcreate/closeup/CU20041203A/inde...

id:tetlis

確かにレイアウトを崩されることがありますが、だからこそベストなセッティング方法を知りたいのです。

アクセサビリティの観点からは変えられる方が良いみたいですので。実際小さな字のページでは自分も良く大きくして読みます。

2006/11/02 18:20:39
id:backupper No.2

回答回数95ベストアンサー獲得回数10

ポイント20pt

意図を汲みきれているか自信がありませんが。

* {font-size: 20pt;}/*絶対値*/

h1 {font-size: 200%;}

h2 {font-size: 140%;}

h3 {font-size: 130%;}

h4 {font-size: 120%;}

h5 {font-size: 110%;}

h6 {font-size: 100%;}

p {}/*20ptになる*/

みたいに、初めに全ての文字の標準の大きさを固定で指定した後、%やemの相対値で変更すると良いのでは無いかと思います。

アドレスはダミーです。

http://q.hatena.ne.jp/

id:jiangmin-alt No.3

回答回数125ベストアンサー獲得回数8

ポイント20pt

例えばどのような指定をしてうまくいかなかったのか、具体的なサンプルをhtmlとcssのセットで示されると、言わんとするところがよく伝わるのではないでしょうか。仕様書に出てくる実例も参考になるかもしれません。

http://www.w3.org/TR/CSS21/

id:smoking186 No.4

回答回数74ベストアンサー獲得回数6

ポイント20pt

Yahoo! UI Libraryに各種ブラウザで表示される文字サイズをなるべく統一しようというCSSがあります.

Yahoo! UI Library: Font CSS

これを組みこんでしまうのが一番速いと思います.

基本サイズは13px, line-heightは16pxになっています. 文字サイズの指定はすべて%で行います. 10px-26pxまではどのように指定すれば良いかの表も載っています.

Font-family Adjustment Example - YUI Fontsのサンプルを見ると分かりますが, ちゃんとIEの「文字のサイズ」→「最大」やFirefoxの「文字サイズ」→「大きく」等で文字サイズが変更できます.

id:Bill No.5

回答回数17ベストアンサー獲得回数3

ポイント20pt

ブラウザによって表示がまちまちな気がして。

この部分が質問の文章の中で解決すべき問題だと解釈しました。CSSバグリスト@CSSバグ辞典スレッドに載っているようなバグ(?)は避けるなりして、それでも表示が微妙に違うのが気になる場合には、文字サイズだけを気にしても、少なくても私には満足する結果が得られず、いつも line-height や vertical-align や margin や padding なども気にします。

wuさんという方が、各UA のデフォルトスタイルシートの差異で悩んでいる人のために、デフォルトスタイルの差異を無くすCSSというものを公開しています。これを使用した上で、さらに font-size を指定する際にはパーセント値で指定するのが良いと思います。font-size を em単位で指定すると、WinIE でブラウザのフォントサイズを変えたときに変化が大きすぎるようになるという問題があります。

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

回答リクエストを送信したユーザーはいません