画面の確認とレイアウトパターン

<< 前のページ メインページの修正

実際に画面を確認します。
左側にサイドバー、中央にコンテンツ、右側にサイドバー2が配置されていることがわかります。

パターン1

次に、スタイルシートを変更します。サイドバーとコンテンツを1かたまりにしているラップのfloatをleftからrightへ、サイドバー2のfloatをrightからleftへ変更し、画面を確認します。

サイドバー2が左側、ラップ(サイドバーとコンテンツ)が右側と、レイアウトが変わりました。

パターン2

最後に、左側にサイドバー、中央にコンテンツ、右側にサイドバー2が配置されている状態に戻してから、
ラップで1かたまりになっているサイドバーのfloatをleftからrightへ、コンテンツのfloatをrightからleftへ変更し、画面を確認します。

パターン3

このように、メインページのテンプレートはいじらずに、スタイルシートだけでレイアウトが変更できることがわかりました。ラップを使えば、4カラムレイアウトでも5カラムレイアウトでも自由にレイアウト変更が可能になります。


ところで、もしラップが無かったらどうなるかというと、このレイアウトの変更に多少制限がかかってしまいます。ラップを使わずにレイアウトすることも可能ですが、ラップが無いと、メインページのテンプレートにまで修正に手が入ることになります。

今後一切レイアウトは変更しないという場合、また、メインページのテンプレートをいじることが面倒でなければ、ラップは使わなくても構いません。


次のページ >> その他テンプレートも3カラムにする

▲ページトップへ