本体より上部のエリアです。
自分の正体やロゴなどを表示します。
ページの説明
Content
箇条書き
順不同型<ul>(unordered)要素
| 実行 | プログラム |
|---|
|
|
<ul>
<li>卵</li>
<li>醤油</li>
<li>きざみのり</li>
</ul>
|
番号順<ol>(orederd)要素
| 実行 | プログラム |
|---|
- お茶碗にご飯よそる
- ご飯の上に卵をかける
- 醤油ときざみのりをかけて混ぜる
|
<ol>
<li>お茶碗にご飯よそる</li>
<li>ご飯の上に卵をかける</li>
<li>醤油ときざみのりをかけて混ぜる</li>
</ol>
|
箇条書きの入れ子
| 実行 | プログラム |
|---|
|
|
<ul>
<li>ホーム</li>
<li>企業情報
<ul>
<li>代表あいさつ</li>
<li>会社概要</li>
<li>IR情報</li>
</ul>
</li>
<li>サービス</li>
<li>お問い合わせ</li>
</ul>
|
基本的な表
| 実行 | プログラム |
|---|
| タイトル | 内容 |
|---|
| 型式 | HTML5 |
| 文字 | UTF-8 |
| 見出し | H1～H6 |
|
<table border>
<tr><th>タイトル</th> <th>内容</th></tr>
<tr><td> 型式</td> <td> HTML5</td></tr>
<tr><td>文字 </td> <td>UTF-8</td></tr>
<tr><td>見出し</td> <td>H1～H6</td></tr>
</table>
|
実際の手順
- テーブル要素を改行して配置します。
<table>
</table>
- 間にインデントを付けてtr要素を配置します。
<table>
<tr></tr>
</table>
- コピペして2行にしておきます。
<table>
<tr></tr>
<tr></tr>
</table>
- tr要素の間にth,td要素を表の数だけ作ります。
<table>
<tr><th></th><th></th><th></th><th></th></tr>
<tr><td></td><td></td><td></td><td></td></tr>
</table>
- td行を必要な行数にします。lhにa~dを入れておきました。
th,td要素の間に表の内容を挿入していきます。thにa~d,tdに1~４を入れておきました。
以下コピペできます。
<table border="1">
<tr><th>a</th><th>b</th><th>c</th><th>d</th></tr>
<tr><td>1</td><td></td><td></td><td></td></tr>
<tr><td>2</td><td></td><td></td><td></td></tr>
<tr><td>3</td><td></td><td></td><td></td></tr>
<tr><td>4</td><td></td><td></td><td></td></tr>
</table>
- 上のコーディンクをコピペしてみました。
- 表全体の横の大きさを指定しました。
見出しのセンタリングをしました。
<table border="1" width=100px;>
| a | b | c | d |
|---|
<tr align="center"><th>a</th><th>b</th><th>c</th><th>d</th></tr>
valign=""はleft,center,right,justify(両端揃え)
| 1 | | | |
| 2 | | | |
| 3 | | | |
| 4 | | | |