April 23, 2010

CSSのデフォルト設定

WEB標準のサイトを作成するにあたって
不要なリスクを避けるためのデフォルトCSS設定。

いろいろなブログのネタとしても使われているようなのでちょっと公開。


body,
div, 
ul, ol, li,
dl, dt, dd,
h1, h2, h3, h4, h5, h6,
pre,
form, fieldset, input, textarea, 
p, blockquote,
th, td {
margin: 0 ;
padding: 0 ;
}

まずは定番。
余計なアキをまずはキッチり0設定。
*(アスタリスク)を使った全対象設定は
今では嫌われつつあるようですので、必要な分だけどうぞ。


img {
border: none;
vertical-align:bottom;
}

ブラウズするとボテッと画像周りについてしまうフチ(border)を解除する設定も必須。
「vertical-align」は、img下にどうしても取れないアキが発生した際に疑ってみると良い要素。
デフォルト化するかは、使いつつ様子を見ましょう。
人によってはtopに設定しているところもあるようです。


li {
list-style: none;
}

リスト表記の文頭に出ちゃうポッチは取っておきましょう。
はじめてCSSをいじったときは、これを消すのに必死‥だったような。


address , em {
font-style: normal;
}

好みと言われればそれまでですが、
極力むだな斜体はなくしましょう。
それが、ほとんど陽の目を見ない要素であったとしても。



SafariやGoogle ChromeについているWebインスペクタを利用して
いろんなサイトのコードを見てみるのも良いかもしれませんね。
May 2011
Sun Mon Tue Wed Thu Fri Sat
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31
Recent Entries
Categories
Monthly Archives