|
ここで紹介するタグはホームページ作成の上で、特に使用頻度の高いタグですので、その他のタグを参照したい場合はHTMLタグ辞典をご覧ください。なお、色が薄いタグは紹介はするものの使用すべきではないタグです。
画像を挿入する<IMG> 使用例は「実際に作ってみよう：画像を挿入する」
| 使用タグ |
意味合い |
書き方の例 |
| <img src=""> |
画像の場所を指定 |
<img src="./xxx/yy.gif"> |
| <img border=""> |
画像に枠線を付ける |
<img border="1"> |
| <img alt=""> |
画像の代替テキスト |
<img alt="画像"> |
| <img width=""> |
画像の幅をピクセルで指定 |
<img width="100"> |
| <img height=""> |
画像の高さをピクセルで指定 |
<img height="100"> |
| <img hspace=""> |
画像の左右の余白をピクセルで指定 |
<img hspace="10"> |
| <img vspace=""> |
画像の上下の余白をピクセルで指定 |
<img vspace="10"> |
| <img align=""> |
画像の回り込みを指定 |
-- |
| 上揃え |
<img align="top"> |
| 中央揃え |
<img align="middle"> |
| 下揃え（初期の設定はこれ） |
<img align="bottom"> |
| 左寄せ |
<img align="left"> |
| 右寄せ |
<img align="right"> |
|
※画像のIMGタグはタグで閉じない。</img>は必要ありません。 |
組み合わせ例
 画像の回り込みは右寄せ。 |
<img src="../../img/logo.gif" width="140" height="53" border="1" hspace="5" vspace="5" align="right" alt="トップロゴ">画像の回り込みは右寄せ。 |
リンクを指定する<A> 使用例は「実際に作ってみよう：リンクを指定する」
| 使用タグ |
意味合い |
書き方の例 |
| <a href=""> |
リンク場所を指定 |
<a href="./003.html"> |
| <a name=""> |
ラベルを付ける |
<a name="abc"> |
| <a target=""> |
ウィンドウの表示方法やラベルへのリンク |
-- |
| 新しいウィンドウに表示 |
<a target="_blank"> |
| 同じウィンドウに表示 |
<a target="_self"> |
| 親フレームに表示 |
<a target="_parent"> |
| フレームを解除する |
<a target="_top"> |
| ページ内のラベルへ |
<a href="#abc"> |
| 違うページのラベルへ |
<a href="./01.html#abc"> |
|
組み合わせ例
| 画面のトップへ戻る |
<a href="#top">画面のトップへ戻る</a> |
表（テーブル）を挿入する<TABLE> 使用例は「実際に作ってみよう：表を作成する」
| 使用タグ |
意味合い |
書き方の例 |
| <table> |
これから表を挿入する |
<table></table> |
| <tr> |
行を指定する |
<tr></tr> |
| <td> |
行に対する列を指定する |
<td></td> |
|
組み合わせ例
|
|
<table border="0" cellpadding="10" cellspacing="1" bgcolor="#999999">
<tbody>
<tr>
<td bgcolor="#ffffff">1</td>
<td bgcolor="#ffffff">2</td>
<td bgcolor="#ffffff">3</td>
</tr>
<tr>
<td bgcolor="#ffffff">4</td>
<td bgcolor="#ffffff">5</td>
<td bgcolor="#ffffff">6</td>
</tr>
</tbody>
</table> |
これら表のタグに設定する属性は以下のようになります。
|
各タグの属性 |
属性の意味 |
書き方の例 |
| 表の骨格 <table> |
border |
表の枠を指定 （0で枠なし） |
border="1" |
| width |
表の幅を指定 |
width="500" |
| width="80%" |
| height |
表の高さを指定 |
height="500" |
| height="80%" |
| cellpadding |
セル内の余白を指定 |
cellpadding"3" |
| cellspacing |
罫線の幅を指定 |
cellspacing="1" |
| bgcolor |
表全体の背景色を指定 |
bgcolor="#f5f5f5" |
| 表のセル <td> |
width |
指定したセルの幅 |
width="300" |
| width="100%" |
| height |
指定したセルの高さ |
height="250" |
| bgcolor |
指定したセルの背景色 |
bgcolor="#ffffff" |
| align |
指定したセル内の位置揃え
（右寄せ/中央寄せ/左寄せ） |
align="right" |
| align="center" |
| align="left" |
※セルとは行と列によって区切られた一つの領域のことです。
※セルの属性は基本的に<td>内に書き、<tr>はそのままにします。
|
