DesignWalkerDesignWalkerロサンゼルスで働くウェブデザイナーの日記。25件のコメント本日は、実用的なCSS(スタイルシート)のお話。CSSコーディングを始める一番最初にbodyタグに設定しておくと、結構便利かな?と思われるポイントをまとめてみました。padding:0;って設定しておくと、とりあえずブラウザの標準で設定されている余白を無くす事ができますね。ブラウザごとにこの余白の設定はまちまちなもので、わたくしは最初に0にしてます。(デザインにもよりますが。)line-height:1.4;これは、行間設定ですわ。1.4はモニタで文章を読むときに、人間が一番読みやすいと言われている行間設定です。color:#333;文字の色ですね。これも、デザインによりけりですが。真っ黒な文字色よりも、濃いグレーくらいのほうが目にやさしい?(好みの問題ですが。sans-serif;フォントの設定ですね。こちらはお好みのフォントで良いかと思われますが。font-size:0.9em;フォントサイズは、わたくし最近は、0.9emに設定するようにしてます。12pxとか14pxとかpxで指定される方も多いかと思われますが。1emに設定しておくと、ブラウザの標準設定では、実際には16pxで表示されるようです。日本語のような2バイト文字では、16pxちょっと大きすぎるかなぁ。感じなので、0.9emに設定。16×0.9=14.4なので、ブラウザの設定を変更していないユーザーさんには、実際には14.4pxで表示されてるはず。ちなみに0.875emって設定すると14pxで表示されます。ブラウザの設定でフォントのサイズを大きめに変更してるユーザーさんには大きく表示されるので、pxで設定するよりも、親切設定って事ですね。わけで、まとめてみると。sans-serif;font-size:0.9em;}これは、あくまでも参考ということで。デザインによっても設定は微妙に変わってくると思いますが。日本語サイトで広範囲のユーザーを対象とする場合は注意。AMsans-serifさん貴重な情報ありがとうございます。ある(ハ)上記のような、条件がそろうと文字化けが起こる可能性があるようです。PMフォントの固定するのは最悪ですよ。PM山田さんコメントどうもありがとうございます~!!実際、日本のおじいちゃんやおばあちゃんもネットやってるんですかね??サイトによっては、そういった事も考慮した作りにすることは大切ですよね~。PMじいちゃんばあちゃんでなくてもフォントサイズには悩まされますよ。「16pxちょっと大きすぎるかなぁ。」と思われる方が、ブラウザの設定を14.4pxなどになさればいいのではないでしょうか。見たい(ブラウザに設定している)サイズより縮小表示されてしまうわけですから、親切にはならないと思います。AMcolorだけ指定するのってどうなんでしょう。PMむるむるさん貴重なご意見ありがとうございます。確かに、標準設定から小さく変更してるわけですから、親切ではないかも。