直線上に配置

メニュー

  • はじめに
  • レイアウトの考え方
  • レイアウトの概要
  • レイアウトコンテナ挿入
  • HTMLタグの初期化
  • メイン
  • ヘッダ
  • コラム
  • コンテンツ
  • フッタ
  • ナビゲーション準備
  • ナビゲーション
  • 文字入力
  • スタイル設定
  • 問い合わせ

はじめに

これまでのホームページは、テーブル(表)を使ったレイアウトが既定のフォーマットとして採用されていました。

テーブルのレイアウトは操作上都合のよいところもありますが、入り組んだレイアウトの場合はタグの構造が複雑でわかりづらく膨大になるというデメリットがあります。

一方、ここで取り上げるCSSレイアウトは、ホームページの内容と構造はHTMLで記述し、レイアウトや装飾などのデザイン要素はスタイルシートに記述する、という具合に分離することで、以下のようなメリットがあります。

  • コードが少ないので表示速度が速い
  • 異なるOSやブラウザーでもほぼ同様の見た目にできる
  • レイアウトの大幅な修正もスタイルシートを操作すれば良いので手間がかからない
  • タグの構造がシンプルなので、検索エンジンに把握されやすい
直線上に配置

| |