文章を書く
見出し
新聞・雑誌などで、記事内容が一目でわかるように、文章の前に書く簡単な言葉・標題・タイトルのことを『見出し』 と言います。HTMLでも『見出し』用のタグがあります。
<h2>見出し2番目</h2>
<h3>見出し3番目</h3>
<h4>見出し4番目</h4>
<h5>見出し5番目</h5>
<h6>見出し6番目</h6>
※<h1>が一番重要な見出しです。次に<h2>、<h3>...と続きます。
見出し1番目
見出し2番目
見出し3番目
見出し4番目
見出し5番目
見出し6番目
段落(だんらく)
文章を書くときに見出しをつけたら次は『段落』です。文章と文章を区切るときに使います。
段落には<p>(ピー)タグをつかいます。
<p>ある日、おじいさんは山へ芝刈りに、おばあさんは川へせんたくに...</p>
昔々ある所におじいさんとおばあさんが住んでおりました。
ある日、おじいさんは山へ芝刈りに、おばあさんは川へせんたくに...
このように自動で行と行の間にスペースができます。
<p>今日のお昼ごはん</p>
改行(かいぎょう)
文章を書いているうちに、次の行からあらたに始めたい場合は<br>(ビーアール) タグで強制的に改行することができます。
おばあさんは桃をひろあげようとしました...
見た目は『段落』と似ていますが、段落の場合は<p>タグ、 改行の場合は<br>タグを使うようにしましょう。
水平線(すいへいせん)
文章や画像の区切りとして線を引きたいときは<hr>(エイチアール) タグで水平線を引くことができます。
青年になったももたろうはある日...
<hr>水平線は長さ(width)
や太さ(size)を変えたり、色(color)
を付けたりすることができます。widthやsize、colorはすでに出てきています。指定の仕方は同じです。
くぼみのような影を消したい場合は、noshadeを加えます。
<hr size="30">
長さを変える
<hr width="40">
色を変える
<hr color="blue">
くぼみを消す
<hr size="10" noshade>
長さを変える
色を変える
くぼみを消す
<hr color="green" size="10">
きんたろう
リスト
ホームページでは、ページの左側や右側にサイトの項目をしめすナビゲーションがあります。 これらはリストをつくるタグで書かれている場合が大半です。タグは<ol>、<ul>、<li> といっきに三種類もタグがでてきます。順番に見ていきましょう。
まずリストに番号をつけて表示します。
<li>いぬ</li>
<li>さる</li>
<li>きじ</li>
</ol>
- いぬ
- さる
- きじ
このように上から順番に自動で数字が表示されます。では<ul>はどうでしょう
<li>ももたろう</li>
<li>きびだんご</li>
<li>おびがしま</li>
</ul>
- ももたろう
- きびだんご
- おにがしま
<ul>はリストのあたまに●がつきます。
<li>カレーライス</li>
<li>ハンバーグ</li>
<li>オムライス</li>
</ol>
これで文章を書くの必要なタグはだいたい出てきました。
今までに出てきたタグと組み合わせて色を付けたり大きさを変えたりすればホームページを作っていくことができます。
次のページでは『フォーム』を見ていきます。