このページのナビゲーション トップページ   ホームページのテンプレート  

テンプレートのレイアウト

cssは{}の中に指定します
例えば
body {background-color: #b0c4de;}
であれば
bodyはホームページの全体を表します。そのbackground-colorとは背景を表します
コンロ:とセミコロン;の間には色が指定してあります
この場合は:#b0c4de;とちょっとわかりずらい色ですが、
例えば#ffffffの場合には白になります
ちなみに黒は#000000で
赤は#ff0000、
青は#0000ffになります


ナビ画像


他も同じで
strong {color: #000000;}の場合には
strongは強調するタグですので、本来も黒ですがこの#000000
を例えば#ff0000にするとは強調部分の文字はすべてが赤くなります
.toph1{ width: 800px;height: 30px;font-size: 18px; color: #000000; text-align:center; margin: 22px auto 10px auto}
の場合には
先頭にドットが付いていますが
クラスを表しています
ちなみにIDは#をつけます。
ドットが付いているという事はそれはクラス名である事が解ります。
toph1がクラスになります toph1の部分はbody同様にどこをどうするかの、どこにあたります。 つまりはクラス名toph1の部分を指定している事になります 例えばHTMLのファイルにtoph1をつけたタグがあるとします
そのタグの部分をCSSファイルから指定している事になります
【その中身を見てみます】
width: 800px;は幅が800px;と指定しています
height: 30px;は高さが30pxと指定しています
font-size: 18px;は文字の大きさを指定します
color: #000000;は文字の色を指定しています
text-align:center;文字の位置を指定しています
margin: 22px auto 10px autoは外側の余白を上下左右を指定しています。
上が 22pxで 右はautoです。autoは自動を表しています。下が10pxで。右がautoと自動になります


ナビ画像2


もう少し詳しく知りたいのであれば【CSSの使い方】





目指そう!物知り博士TOPへ



↑このページの先頭へ