CSS 2カラムの段組レイアウト

CSSによる段組の基礎となるサンプルです。ここから各ブラウザで細かな修正を加えて作業を進めて行きます。このソースが参考になれば幸いです。

ブロック要素とインライン要素

全体を梱包するための<div>を作ります。
paddingやborderはブラウザによって解釈のし方が違うので気を付けて下さい。
ページのメインとなる情報源をなるべくソースの上の方へ記述します。
メニューなどはソースの最後の方に記述し配置は後から行います。
フロートの解除し忘れにご注意下さい。

CSSは後付けでよい

CSSは外部スタイルシートファイルで一括でデザインを指定出来るため、まずはHTMLで文章構造をしっかり組み立てて、IDCLASS付けをきちんと行う事を優先しましょう。

テーマを絞り込む

そのページで扱うテーマをなるべく絞り込んでおくと、製作もスムーズになります。1つのサイトで色々なテーマを扱う場合は、別ページを作ってリンクさせた方が、SEOに効果的だと思います。

段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落 段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落 段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落 段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落 段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落 段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落段落

≪戻る