2009年6月25日木曜日

CSS備忘録

★font-sizeを指定したらline-hightもセットで指定すること
ブラウザごとユーザーの設定ごとにテキスト表示の解釈が違う。
IEでは行間を調整してくれないがfirefoxでは適当にやってくれる。
そのため、heightの見栄えに違いが出てしまう。



★できるだけハックは使用しない
基本に忠実に作っていればハック無しでもキチンと表示できる。
どうしてもダメなところはハックする。
ハックに頼り過ぎない。



★できるだけpaddingは使用しない。
 marginで処理できるものはmarginで。

marginが利かない場合、サイズによってmarginが取れずズレてしまうので
1pxずつ調整してみると、うまくいくことがある。



★IEなどブラウザ別表示の許容範囲とは?
配置がずれてなくて、画像等が隙間やずれが生じないこと。



★基本のターゲットブラウザ、エンジン
 IE6 IE7 Firefox1.5以上 Safari1.3以上
 IE → IEエンジン
 netscape・firefox → Gekkoエンジン
 Safari → Webkit



★faviconはサイトのルート上に置く
imagesフォルダーに入れるのではなくてindex.htmlと同じ階層にfavicon.icoを置く。
ローカルでチェックしてもfirefox以外のブラウザでは
ネット上から見ないとfaviconが表示できない。
IEはサーバーの一番上のフォルダにfavicon.icoがあれば勝手に読んでくれる。



★アンカータグの指定はlink visited hover activeの順番を守る
 この順番で設定しないと動作が正常にならない。



★XML宣言について
XHTMLで作るならXML宣言文は必須。
IE6の互換モードはターゲットブラウザから外す。(XML宣言しているから)
互換モードを入れてしまうとCSSはまったく変わってしまう。
互換モードや古いブラウザで作るならHTML4.01や最悪HTML3.2で作ること。
XHTMLでサイトを作る場合、基本的に古いブラウザや互換モードは外した場合の話になる。



★floatはtableの焼き直し。
 floatはtableレイアウトと大差ない。
 SEO対策を施すなら、絶対配置&相対配置&floatを組み合わせる。



★CSSの概念とは
 HTML → データ
 CSS → レイアウト
 という分離によって、データは重要なものを好きな位置に記述でき、CSSで見やすく配置すること



★テキストタイプのブラウザ
 SEOを意識するならテキストタイプのブラウザがあると便利。
 テキストタイプのブラウザ Lynx
googleなど主要なサーチエンジンのロボットはテキストタイプのブラウザの見え方と同じ情報の見方をしている。

0 件のコメント: