body要素内 基本的なタグ
body基本情報
コメントを挿入
<!-- -->で囲む
<!--ここは本文には表示されません-->
見出し
| 入力 | 表示 |
|---|---|
| <h1>見出し1</h1> | 見出し1 |
| <h2>見出し2</h2> | 見出し2 |
| <h3>見出し3</h3> | 見出し3 |
| <h4>見出し4</h4> | 見出し4 |
| <h5>見出し5</h5> | 見出し5 |
| <h6>見出し6</h6> | 見出し6 |
段落
<p>この中が段落</p>
改行は<br>を入れる。
<body>タグにただ文章を書き込んだだけでも表示されるが、
文法上よろしくないので、<p>で囲む
改行
<br>を入れることで改行される
水平線
<hr>を入れることで水平線が挿入される
要素の見栄えを整える属性(W3C非推奨)
見出し要素、p要素に指定できる属性
| 属性 | 属性値 | 説明 |
|---|---|---|
| align | left center right | 表示位置の指定 左 中央 右 |
hr要素に指定できる属性
| 属性 | 属性値 | 説明 |
|---|---|---|
| color | カラーコード or 色名 |
水平線(hr)の色を指定 |
| align | left center right | 表示位置の指定 左 中央 右 |
| size | 1以上の整数 | 高さを指定 |
| width | 1以上の整数 | 横幅を指定 |
metaタグを使ったページ情報の埋め込み
head要素内には、<meta>タグを使って、文字コード以外の情報もを埋め込むことができます。
<meta http-equiv="属性" content="内容を記述">
| 属性 | 記述する内容 |
|---|---|
| description | ページの説明文 |
| keywords | ページのキーワード |
| author | 制作者名 |
| copyright | 著作権 |
| reply-to | 連絡先 |
| build | 制作年月日 |
| expires | 失効日 |
ブロック要素とインライン要素
- ブロックレベル要素
- インライン要素
見出し・段落・リスト・テーブル・引用・divなど
一つの領域を示す。
データを入れる箱となる要素。
ブロックレベル要素が続く時は改行される。
参考
body要素のすぐ下には、ブロックレベル要素しか置くことが出来ない
body要素のすぐ下には、ブロックレベル要素しか置くことが出来ない
| 要素の種類 | 内容 |
|---|---|
| h1~h6 | 見出し |
| p | 段落 |
| ul,ol,li | リスト |
| table,tr,td,th | テーブル |
| blockquote | 引用 |
| div | 他 |
ブロックレベル要素内の特定の部分に役割や機能をもたせる
中にブロックレベル要素を含むことが出来るが、
中にインライン要素を含むことはできない
インライン要素が続く時は改行されずに横に並ぶ
| 要素の種類 | 内容 |
|---|---|
| a | リンク |
| em | 強調 |
| strong | 強調斜体 |
| span | インライン要素指定 |