HTML index
ホームページ作成ガイド

ステップアップ＆テクニック - ホームページ作成ガイド
HTML&CSS Web制作リファレンス
-ホームページ作成を学ぶ・調べる-

< HOME / ホームページ作成ガイド / 基本設定（CSS）
基本設定（CSS）
スタイルシートでページの基本設定を行ってみます。タグの部分については、「基本設定」をご覧ください。

※ここで使用しているスタイルシートについての詳細は、「ページ全般」、「テキスト・フォント」、「リンク」の各カテゴリーをご覧ください。
　設定方法
この例では、ページの背景色、ページの背景画像、ページのマージン、全体の文字サイズ、全体の文字色、リンクの文字色などを、スタイルシートで設定しています。

■ BODY { }
ページの背景色と背景画像、マージンなどは、BODY { } 内で指定します。

■ BODY, TD, TH { }
全体の文字サイズと文字色は、 BODY, TD, TH { } 内で指定しています（TD と TH は表のセルを指しています）。ページ内に表を置く予定がない場合は、この2つは BODY { } 内に記述しても構いません。

■A:*** { }
リンク文字の色は、A:*** { } 内で指定します。通常（未訪問）のリンク、訪問済みのリンク、マウスでポイントしたとき、クリックした瞬間、この4つの状態別にリンクの色を設定することができます。

※スタイルシートの値を変更する際には、ソース内のコメントを参考にしてください。

　ソース
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=Shift_JIS">
<TITLE>Webサイト</TITLE>

<STYLE TYPE="text/css">
<!--

BODY {
background-color: #FFFFFF; /* ページの背景色 */
background-image: url(back.gif); /* ページの背景画像 */
margin: 3px; /* ページのマージン */
}

BODY, TD, TH {
font-size: 1em; /* 全体の文字サイズ */
color: #2B2B2B; /* 全体の文字色 */
}

A:link { color: #0000FF; } /* リンク文字の色 */
A:visited { color: #0000A0; } /* アクセス済みの色 */
A:hover { color: #FF0000; } /* ポイントしたときの色 */
A:active { color: #FF8000; } /* クリックした瞬間の色 */

-->
</STYLE>

</HEAD>
<BODY>


ここにページの内容を入れていきます


</BODY>
</HTML>

関連ページ
スタイルシート - ページの背景に色を付ける
スタイルシート - ページの背景に画像を使う
スタイルシート - ブラウザの枠とのマージンを指定する
スタイルシート - 文字の色を指定する
スタイルシート - 文字のサイズを指定する
スタイルシート - リンク文字の色を指定する

ホームページ作成ガイドTOP

HTMLタグ｜スタイルシート｜JavaScript｜Webツール｜カラーチャート｜テンプレート｜
< HOME PageTop▲

inserted by FC2 system