https://hmaster.net/


HTMLタグとCSSを使いメモ帳だけで無料でホームページを作成する 方法を分かりやすく解説しているサイトです。 初心者向けに見やすい、読みやすい作りになっています。

テーブルで空白を作る

テーブルと画像を使って空白を作ることが出来ます。<br>タグ でも適宜空白を作ることはできますが前者の方がもっと小さな 空白を作ることが可能です。

■ 空白の作り方

空白の作り方はまずブラウザ上では目に見えない1ピクセル×1ピクセルの 透過gifを用意します。下にspace.gif というgif画像があるので右クリックから透過gifに名前を付けて自分のHPの フォルダに保存して下さい。そして外枠の無いテーブルの中にさきほど保存し た透過gifを挿入してみて下さい。 下のような小さい空白を入れることができます。
ここ右クリックから
透過gifに名前を付けて自分のHPのフォルダに保存して下さい。 ここ
imgの属性width="数字" height="数字"で透過gifのサイズを調整しましょう。また、 alt=""も記述しましょう。

下の空白テーブルは分かり易いようにセル内を赤色にしています。 赤色の部分が1ピクセル×1ピクセルの space.gifです。

【ブラウザ表示】

下に透過gif入りテーブル
右クリックから
透過gifに名前を付けて自分のHPのフォルダに保存して下さい。
上に透過gif入りテーブル

↓小さいテーブルの枠線を消す

下に空白ができました
上に空白ができました

ソース

<table border="1">
<tr>
<td>下に空白ができました</td>
</tr>
</table>
<table border="0">
<tr>
<td><img src="./image/space.gif" width="1" height="1" alt=""></td>
</tr>
</table>

<table border="1">
<tr>
<td>上に空白ができました</td>
</tr>
</table>

このエントリーをはてなブックマークに追加 Instagram

■ その他の項目

テーブルを作る
横幅、高さを指定する
画像や背景色を指定する
表示位置を指定する
テーブルに表題をつける
間隔、余白を指定する
セルを結合する
枠線の色やスタイルを指定する
行と列をグループ化する
枠線の表示方法を指定する
細い枠線のテーブル
テーブルを横に並べる

HTMLタグ一覧のページに戻る