今回は<p>と<div>についてのお話です。
こちらをご覧ください。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=X-SJIS">
<title>このぺーじのタイトル </title>
</head>
<body>
<p>ｐで囲まれた部分です。<br>
このように表示されます。</p>
<p>これも、ｐで囲まれた部分です。<br>
ｐで囲まれた部分ではひとまとめの分として扱われます。</p>
<div>こちらは、ｄｉｖで囲まれた部分です。<br>
このように表示されます。</div>
<div>こちらも、ｄｉｖで囲まれた部分です。<br>
このように表示されます。</div>
</body>
</html>
|
実際に表示してみると！
<p></p>と<div></div>は、ほとんど違いがありませんが、<p></p>では、ひとまとまりの分のあと１行あきます。
<div></div>では、行はあきません。
文章をひとまとめにすると、実は便利なことがあります。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=X-SJIS">
<title>このぺーじのタイトル </title>
</head>
<body>
<p>ｐで囲まれた部分です。<br>
このように表示されます。</p>
<p align="center">これは、ｐで囲まれた部分です。半角の空白＋align="center"がついています。<br>
ｐで囲まれた部分ではひとまとめの分として扱われます。</p>
<div>こちらは、ｄｉｖで囲まれた部分です。<br>
このように表示されます。</div>
<div align="right">こちらも、ｄｉｖで囲まれた部分です。半角の空白＋align="right"がついています。<br>
このように表示されます。</div>
</body>
</html>
|
これを表示すると！
ひとまとめにした文章を、右に寄せたり、真ん中に寄せたり出来るのです。
この、align="right" align="center"は、タグのなかで上のように指定します。
このような「タグの中で指定できる要素」のことを、
タグの属性と言っています。
ＨＴＭＬのタグは、前と後ろで囲んで、ここからここまでというふうに示します。
前タグ、後ろタグという言い方をします。
その前タグの中に、半角スペース＋属性というふうに書き込みます。
後ろタグの方には、書き込みません。
align="left"という属性もあります。左寄せにする指定です。
しかし、<p align="left"></p>や<div align="left"></div>と書かなくても、最初から左寄せになっていますね。
（上のＨＴＭＬを確認してください。）
次は、「見出し」についてです。
見出しには、<h1>から<h6>があります。
別に、見出しに必ず使う必要はありません。
字の大きさが変わることと、太字になることと、<br>を入れなくても改行されるだけのことです。
<p>や<div>と同じように、align="right"やalign="center"の属性が使えます。
これも、百聞は一見にしかず！
|
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=X-SJIS">
<title>このぺーじのタイトル </title>
</head>
<body>
<h1>ｈ１で囲まれた</h1>
<h2>ｈ２で囲まれた</h2>
<h3>ｈ３で囲まれた</h3>
<h4>ｈ４で囲まれた</h4>
<h5>ｈ５で囲まれた</h5>
<h6>ｈ６で囲まれた</h6>
<h1 align="center">ｈ１で囲まれた</h1>
<h2 align="center">ｈ２で囲まれた</h2>
<h3 align="center">ｈ３で囲まれた</h3>
<h4 align="center">ｈ４で囲まれた</h4>
<h5 align="center">ｈ５で囲まれた</h5>
<h6 align="center">ｈ６で囲まれた</h6>
<h1 align="right">ｈ１で囲まれた</h1>
<h2 align="right">ｈ２で囲まれた</h2>
<h3 align="right">ｈ３で囲まれた</h3>
<h4 align="right">ｈ４で囲まれた</h4>
<h5 align="right">ｈ５で囲まれた</h5>
<h6 align="right">ｈ６で囲まれた</h6>
</body>
</html>
|
これを実際に表示すると！
字の大きさは、見る人のブラウザによって違います。
９．ＨＴＭＬでホームページを作る。ＮｅｔｓｃａｐｅとＩｎｔｅｒｎｅｔＥｘｐｌｏｒｅｒへ
ＰＣ−ＰＡＲＫトップに戻る
心の話サイコロＴｏｗｎ！へ