01Highslide JS > 02Ajax > 03MooRevolve > 04その他の機能

01-02 ヘッダーを画面の横幅いっぱいに表示するパターン

ページの周りの余白を消して、ブラウザ画面の横幅いっぱいにヘッダーを表示するパターンです。画面の横幅を大きくしても、常に画面横幅を広く使っている印象になります。ここでは、フッター部分の区切り線も画面の横幅いっぱいに表示します。また、コンテンツ部分は常に画面の中央に表示して全体のバランスを取ります。

参考例:百合が原公園の案内 【 施設, 交通, 花の情報

スタイルシートについて

XHTMLは本来論理構造を記述するものであり、デザインついてはあまり考慮されていません。近年デザインを重視したWebページの需要が高まってきています。そこで CSS(Cascading Style Sheets/スタイルシート)がデザインを構成するものとしてサポートされるようになりました。スタイルシートは細かな デザイン設定が可能になり、従来のHTMLより高度なレイアウトデザインが実現できます。そのため、Webページの論理構造をXHTMLが担当し、デザイン面の設定をCSS(スタイルシート)が担当するようになりました。スタイルシートではデザイン面だけでなく印刷に関する設定などの WebページWebページ以外への出力についてもサポートされています。

<すべて小文字で記述> XHTMLではタグ名がすべて小文字に統一されます。
<終了タグは省略しない> HTMLはリストや段落などの終了タグ「</li>」「</p>」を省略するこができましたが、XHTMLでは省略せずに終了タグを記述します。
<必ず引用符で囲む> HTMLは値が数字などの特定の値に関しては「height=100」のように引用符を省略することができました。XHTMLでは引用符を省略せずに「height="100"」といった形で記述します。
<空要素タグの書き方> 終了タグをもたず単独で使用される<br>などのタグを「<br></br>」と記述しま。通常は省略して、「<br/」と記述することができます。
<属性の省略書式は使用不可> HTMLは属性と値が同じ場合<input type="text" checked>のように記述していましたが、属性名省略せずに<input type="text" checked="checked">と記述します。
<非推奨タグ・属性> XHTMLでは主にデザインに関するタグや属性の使用が非推奨になっています。使うことができないというわけではありませんが、今後廃止が予定されていますので、なるべく使用しないよう心掛けましょう。
<非推奨タグ> 太字<b>、斜線<i>、下線<u>、取消線<s><strke>、フォント<font>、フレーム<frame>、フレームセット<frameset>など。
<非推奨属性> <body>のtext(文字色)、background(背景画像)、link(リンク文字色)、alink(アクティブリンク文字色)、vlink(訪問済リンク文字色)align属性(配置)、width属性(幅)、height属性(高さ)、bgcolor属性(背景色)、name属性(名前)、nowrap属性(改行無し)など。
<その他> XHTMLでは以上の変更点以外にも細かな仕様変更がされています。