YUI Libraryを用いたCSSベースのレイアウトに移行する

文:Tony Patton(Special to TecRepublic) 翻訳校正:石橋啓一郎
2008-04-25 08:00:00
  • このエントリーをはてなブックマークに追加

 

が多くてうんざりするかも知れないが、同じことを実現するテーブルの入れ子を追いかけるよりはこの方がずっと簡単だ。また、CSSのアプローチでは、CSSを編集したり、使うYUI Grids CSSの機能を変えることによって、簡単にレイアウトを変更することができる。

 例えば、

要素に割り当てられているクラスをyui-t2からyui-t1に変更すれば、左側のカラムを160ピクセルにしたレイアウトを使って、簡単にレイアウトを修正することができる。このアプローチを使うためには、YUI Grids CSSに慣れる必要がある。

 YUI LibraryのCSS要素を修正するのは考えもので、CSSのソースを変更する作業は非常にトリッキーだ。コードにはすべてのブラウザに対応するためのいわゆる「ハック」が多く含まれており、CSSを修正する際にそれらすべてを扱いきれない可能性がある。私自身は、YUI Libraryの内容を直接修正するのは避けることにしている。

移行

 CSSはレイアウトに使っても構わないところまで成熟してきた。しかし、このアプローチには落とし穴があり、これにはブラウザの問題も含まれている。この理由から、私は無料で自由に利用できるYUI LibraryのYUI Grids CSSの部分は、ウェブ標準を使ったウェブインターフェースを構築するためには素晴らしいリソースだと考えている。

 あなたはウェブページのレイアウトにCSSを使っているだろうか。あなたのアプリケーションでは、YUI Libraryのどの部分を使っているだろうか。あなたの経験をウェブ開発コミュニティと共有して欲しい。

この記事は海外CNET Networks発のニュースをシーネットネットワークスジャパン編集部が日本向けに編集したものです。海外CNET Networksの記事へ

このサイトでは、利用状況の把握や広告配信などのために、Cookieなどを使用してアクセスデータを取得・利用しています。 これ以降ページを遷移した場合、Cookieなどの設定や使用に同意したことになります。
Cookieなどの設定や使用の詳細、オプトアウトについては詳細をご覧ください。
[ 閉じる ]