スタイルの一覧

属性と指定値一覧

文字色と背景

color

文字の色を指定する。色は#336699のように６桁のカラーコードのほか、red, blue なども使える。yellow を間違えて yelow などと間違えると指定が無視され、たいていは黒にもどる。
color:#336699;
color:red;

background-color

背景色の指定。指定の仕方は color と同じ。
background-color:#336699;

background

背景色と背景画像の指定。背景色は画像の表示ができないときのため。
background:#336699 url(images/yelsq.png);

マージン・パディング

margin

ブロックの上右下左の空白を指定する。半角スペースで区切られた４つの数字は順に上右下左の空白。emは文字の幅を指す。%で指定してもよい。この場合ブラウザの幅が100%
margin:0.5em 1em 0.5em 2em;
margin:3% 5% 2% 10%;

padding

ブロックの背景部分とテキスト領域の隙間
padding: 0.5em 1em 0.5em 1em;
padding: 3% 5% 2% 10%;

ボーダー

border

ブロックを枠で囲む。タイプ、色、太さで指定する。（省略があってもよい）
border: solid #336699 2px;
上右下左で太さを変えたいときは、２つに分けて、
border: solid #336699 2px;
border-width:2px 0px 0px 1em;

テキスト

text-align

ブロック内のテキスト（文）の配置。leftが左寄せ、centerが中央揃え、rightが右寄せ。
text-align:center;
text-align:right;

text-indent

段落最初の字下げ。emは文字の幅を指す。マイナスの値も可
text-indent:1em;

line-height

行間隔の指定。指定しなければ120%弱になっている。画像を含む段落には指定しない方がよい。
line-height: 150%;

フォント

font-weight

文字の太さの指定。normal（普通）, bold（太字）の他に、100, 200, 300, 400, 500, 600, 700, 800, 900 の数字で指定できます。400 が normal で 700 が bold ですがあまり細かな変化は期待しないでください。
font-weight:bold; font-weight:normal;

font-size

フォントの大きさです。その部分(親要素)で普通の大きさが100%です。
font-size:140%; font-size:80%;

font-style

斜体かどうかを設定します。 font-style: normal; 普通 font-style: italic; 斜体