ＨＴＭＬ ワンポイント 文章の整形 |
| 左寄せ | 特に指定をしなければ左寄せで表示されます。 明示的に指定するときは、<div align="left">と </div>で挟んだ部分が左寄せになります。 |
| 字下げ （インデント） |
<blockquote> ・・・・ </blockquote> 引用文として、両側に隙間をあけて表示します。 上下も1行空きます。 上下に空白行を入れたくないときには <ul> ・・・・ </ul> があります。ulタグは箇条書きの始まりと終わりを示すものです。 ブラウザによっては空白行が入りますし、項目のない箇条書きですから、あまり奨められません。 |
| 中央寄せ | <div align="center"> ・・・・ </div> |
| 右寄せ | <div align="right"> ・・・・ </div> |
もう一工夫というときには、TABLE を使うという手があります。
TABLE といえば、たくさんの行と列で出来ている「表」を連想しますが、項目の先頭をそろえたりして画面の整形にも使えます。
背景の色を指定することも出来ますから簡単なタイトルを作るのにも使えます。ＨＴＭＬ ワンポイントのタイトルの部分は次のように記述しました。１行、１枠だけの「表」を使っています。
| <center> | 最下段の</center>までページの中央に表示する |
| <table border="4" bgcolor="#808000" width="80%"> | 枠の太さ＝４、背景の色＝#808000、「表」の幅は全体の 80% と指定 |
| <tr align="center"> | 第1行目の始まり この行に書く文字は中央に表示する |
| <td><br> | 第1升目の始まり 改行（<br>）をいれて文字が枠にくっつかないようにしている |
| <font color="#ffffcc"><b>ＨＴＭＬ ワンポイント</b><br><br> | 文字の色を #ffffcc（ページの背景色）に指定 「ＨＴＭＬ ワンポイント」を ｂタグで囲んで太字にする そのあと改行し、行間をあけるためにもう1回改行 |
| <font size="+2"><b>文章の整形</b></font> | 「文章の整形」の文字を2段階大きくする </font>で大きさの指定終わり |
| </font><br><br> | 文字の色の指定の終わり。表の下段までに隙間をつける。 |
| </td> | 第1升目の終わり |
| </tr> | 第1行目の終わり |
| </table> | 表の終わり |
| </center> | 中央寄せの終わり |
この説明の部分は、枠を書かずに（ border="0"）、背景を白（ bgcolor="#ffffff"）にして作った 縦11行、横2枠の「TABLE」の中に書いています。