§03-03…中央揃え{text-align} – オンライン無料パソコン教室

§03-03…中央揃え{text-align}

(01) 通常のWebページでは全ての文章が左揃えになっています。ここでは<h1>タグ内のデータを中央揃えにする方法を学習します。書式の設定情報は、CSSファイル側に書き込みます。空のCSSファイル「sam02.css」を開いておいてください。<h1>に関して書式を決める場合は、以下のようなソースをCSSファイルに書き込みます。

h1{
 
}

(02) 次にカッコ内に、<h1>のテキストに設定する書式情報を書き込みます。今回は文字の揃えに関する情報です。文字の揃えに関する情報を書き込むには「text-align」プロパティを使用します。括弧の中に「text-align」と書き込んでください。またプロパティ名の後に「:」を入力してください。

h1{
 text-align:
}

(03) 「:」の後にはtext-alignをどうするかを決める値を書き込みます。中央揃えを示す値は「center」です。書き込んだらこのCSSファイルを上書き保存してください。

h1{
 text-align:center
}

広告ブロックブラウザーではコンテンツが表示できません