「CSS」の編集履歴（バックアップ）一覧はこちら
CSS - (2008/04/05 (土) 22:10:13) の１つ前との変更点
追加された行は緑色になります。
削除された行は赤色になります。
■text-align EI6
box要素までセンタリングされる。
■margin EI6
float と同じ方向の margin は２倍になる。
左右の auto は効かない。
■EIでの中央寄せ
上記２つのバグで相殺します。
<DIV style="text-align:center">
<DIV style="text-align:left">
コンテンツ
</DIV>
</DIV>
■padding FireFox1.5
内側に指定した分が全体のサイズにプラスされる。
EI はされない。
■というわけで
サイズを指定しているところでは padding を指定しない。
float を使用しているところでは margin を指定しない。
■しかしながら
margin や padding に関しては他にタグによって色々違う時があるので臨機応変に対処してください。
■aタグ内で line-height が効かない。EI6
先頭に画像でもおいて、img タグに margin とか指定して下げてやると後ろのテキストも
付いてくる。ので、空gifでも使うかな。
■リスト
<dl>
<dt>単語</dt>
<dd>ここに単語の説明などを入れて使います</dd>
<dt>省略
<dd>終了タグを省略しています
</dl>
単語
ここに単語の説明などを入れて使います
省略
終了タグを省略しています
<ol>
<li>項目をここに書きます</li>
<li>終了タグを省略しています
<li>終了タグを省略しています
</ol>
1. 項目をここに書きます
2. 終了タグを省略しています
3. 終了タグを省略しています
■フォント関係
font-size:14px;
font-weight:bold;
line-height:140%;
font-family :"ヒラギノ角ゴ Pro W3", Osaka, "ＭＳ Ｐゴシック", Kochi Gothic;
color:#000;
■余白
ブロック要素の外側
margin:0px 0px 0px 0px;
ブロック要素の内側
padding:0px 0px 0px 0px;
※widthを指定している場合、paddingの値が合計されるので差し引く。
■横にならべる、解除
float:left;
clear:both;
■全称セレクタ
全ての要素に適用されるように、セレクタにワイルドカード "*" が使えます。
* {margin: 0; padding: 0;}
全ての要素のマージンとパディングを 0
■高さの最大最小
max-height:999px;
min-height:999px;
■HEADの雛形
<HTML>
<HEAD>
<META http-equiv="Content-Language" content="ja">
<META http-equiv="Content-Type" content="text/html; charset=shift_jis">
<META name="Discription" content="ここに文章の要約を記述">
<META name="KeyWords" content="ここに検索用キーワードを記述 半角スペース区切り">
<META name="author" content="ここに作者を記述">
<TITLE>ここにタイトルを入れる</TITLE>
</HRAD>
<BODY>
ここに表示する内容をHTMLで記述
</BODY>
</HTML>
■HEADの文字コード
<META http-equiv="Content-Type" content="text/html; charset=shift_jis">
<META http-equiv="Content-Type" content="text/html; charset=EUC-JP">
<META http-equiv="Content-Type" content="text/html; charset=UTF-8">
■キャッシュを無効にする場合
以下を書き足します。
<META http-equiv="Pragma" content="no-cache">
<META http-equiv="Cache-Control" content="no-cache">
<META http-equiv="Expires" content="0">
■DIVとSPAN
divもspanも無意味のタグですがCSSを反映する為だけに良く使用します。
divはブロック要素。改行します。
spanはインライン要素。改行しません。ブロック要素の中にある。
■クラスとＩＤ
classが . idが #
idは同ページに１つしかあっては駄目。
.color1{color:#f00;}
#colorA{color:#f00;}
■外部ファイルに書く場合
index.htmlに以下の分を書く。
<LINK rel="stylesheet" type="text/css" href="syosiki.css">
同ディレクトリにsyosiki.cssを置く。
その中身の例。
BODY{
font-size :12pt;
background :#ffffff;
margin :0px;
padding :0px;
font-family :"ヒラギノ角ゴ Pro W3", Osaka, "ＭＳ ゴシック", Kochi Gothic;
color :#440044;
background-image :url(img/back.gif) top repeat-y;
}
A:link {color:#0000ff; text-decoration:none;}
A:visited {color:#aa00ff; text-decoration:none;}
A:active {color:#ffaa00; text-decoration:none;}
A:hover {color:#ffaa00; text-decoration:none;}
■ファイルの中に書く場合
<style type="text/css">
<!--
body{background-color:#ffffff; color:#000000;}
-->
</style>
■タグの中に書く場合
<h2 style="color:red;">中見出し</h2>
へ(-。-)ノ
