今回も参考書を片手にHTMLの研究と勉強をおこなっていきます。
ほぼ個人的なノートを兼ねているので軽く流してください😅
【HTML＆CSSの研究】
その2 HTMLの基本的な書式
■HTMLの書式と名称■ <P>タグの例
■タグ■
HTMLのタグとは、小なり記号(＜)と大なり記号(＞)で囲まれた部分をいう。開始タグと終了タグをまとめてタグという。
■開始タグ■
タグは必ず「開始タグ」で始まる。開始タグは「<」のすぐ後に「タグ名」が続き、「>」で終わる。
基本的な開始タグの書き方
<〇〇〇>
■終了タグ■
終了タグは「</」のあとにタグ名が続き、最後は「>」で終わる。終了タグには属性を含めない。
基本的な終了タグの書き方
</〇〇〇>
■タグ名■
開始タグと終了タグにはタグ名が含まれる。タグ名とはいわゆるどういう風な機能にするかのような命令文のようなもので、機能により様々なタグ名がある。
■属性■
タグに追加的な情報を付け加えるのが属性である。属性は必ずつくわけではなく、付かない場合もあれば複数つく場合もある。
属性を付け加えた場合は属性値を設定する。
■属性値■
タグに属性を付け加えた場合は属性値を設定するが、書き方として、属性と属性値はイコール(＝)でつなげて記述する。属性値はダブルクォート(")で囲む
(例)
<p 属性＝"属性値”>
↓ ↓
<p class="hello">
<p 属性＝"属性値”>
↓ ↓
<p class="hello">
■コンテンツ■
開始タグと終了タグに囲まれた部分をコンテンツと言い、実際に画面に表示されるのはコンテンツの部分で、タグ自体は表示されない。
■要素■
タグに囲まれたコンテンツをひとまとめにして要素と呼ぶ。
HTMLを書く際の注意点
・開始タグ、終了タグ、タグ名、属性などコンテンツ以外の部分は半角文字で記述する。(一部例外的に全角使用)
・コンテンツ部分はテキストを自由に記述する事ができるが、コンテンツ部分には半角の「<」「>」を含める事はできない。ブラウザが「これはタグかな？」と誤認識してしまい正しく表示できなくなるためである。
開始タグと終了タグが無い「空要素」
多くのタグには開始タグと終了タグがある。しかし、コンテンツを持たず終了タグがないタグがある。こうしたタグを空要素という。
(例)
<br> 改行する
<hr> 区切り線を引く
区切り線↓
改行、インデントでHTMLを読みやすく
ある要素のコンテンツに別のタブが含まれる場合、改行したり、院で円と(字下げ)したりしてHTMLを読みやすく整理する。インデントする場合は〔TAB〕キーか、２～4個程度の半角スペースを入力する。なお、改行やインデントをしてもページの表示が変化する事はない。
(例)
<ul><Ii>トマト</li><li>レタス</li></ul>
インデントして読みやすく↓ ↓ ↓
<ul>
<li>トマト</li>
<li>レタス</li>
</ui>