HTMLレイアウト

サイトの外観を改善するために、ページレイアウトは非常に重要です。

慎重にあなたのページのレイアウトを設計してください。

オンラインの例

<div>要素を使用して、ページレイアウト
レイアウトに<div>要素を使用する方法。

ページレイアウト、<table>要素を使用します
レイアウトに<table>要素を使用する方法。

サイトのレイアウト

ほとんどのサイトは（雑誌や新聞のような）複数の列にコンテンツます。

ほとんどのサイトは、複数の列を作成するための<div>や<表>要素を使用することができます。 CSSは、要素を配置するか、ページの背景とカラフルな外観を作成するために使用されます。

	私たちは、美しいレイアウトを設計するためにHTMLテーブルタグを使用できますが、テーブルタグは、レイアウトツールとして使用することは推奨されていませんが - ないテーブルレイアウトツール。

HTMLレイアウト - <div>要素を使用して

div要素は、HTML要素をグループ化するために使用されるブロックレベル要素です。

次の例では、複数列のレイアウトを作成するために、5 div要素を使用しています。

上記のHTMLコードは、次の結果が得られます。

HTMLレイアウト - テーブルを使用して、

使用HTMLの<表>タグには、簡単な方法でレイアウトを作成することです。

ほとんどのサイトは、複数の列を作成するための<div>や<表>要素を使用することができます。 CSSは、要素を配置するか、ページの背景とカラフルな外観を作成するために使用されます。

	あなたは素敵なレイアウトを作成するためにHTMLテーブルを使用することができますが、目的は設計テーブルの表形式のデータを提示する場合であっても - ないテーブルレイアウトツールを！

次の例では、2つのテーブルの3行を使用しています - 最初と最後の行は、2つにまたがることはcolspan属性を使用しています。

上記のHTMLコードは、次の結果が得られます。

HTMLレイアウト - 役に立つヒント

ヒント：CSSを使用しての最大の利点は、CSSコードを外部スタイルシートに格納されている場合、そのサイトは、保守が簡単になるということです。1つのファイルを編集することにより、すべてのページのレイアウトを変更することができます。 CSSの詳細については、私たちの訪問CSSのチュートリアルを 。

ヒント：により高度なレイアウトを作成するためには非常に時間がかかり、テンプレートを使用すると、迅速なオプションです。検索エンジンを介して、あなたは（あなたがこれらのビルド済みサイトのレイアウトを使用し、それらを最適化することができます）無料のウェブサイトのテンプレートの多くを見つけることができます。

HTMLのレイアウトタグ