左から右へ、Col1 id 幅 560 ピクセル、パディング 10 ピクセル、中央の列、幅 250 ピクセル、パディング 5 ピクセル、Col3 (サイドバー) は幅 200 ピクセル、パディング 3 ピクセル。背景色、列のテキストの長さに関係なく、垂直方向に均等に伸ばす必要があります。それを機能させるためのJavaScript（jQueryの回避策）はありません。CSS を使用した純粋なセマンティック マークアップである必要があります。コンテンツが移動する場合、各列にはネストされた色の列が必要です。列 1 は SEO プロミナントにする必要があります。これは、Google やその他の検索エンジンがクロールするネストされた最上位の列を意味します。「The Holy Grail」レイアウト、「A List Apart」の記事を使用しましたが、これらのソリューションは非常に複雑であるため、メインの列が左に押し出され、ネストされた列がパディングで右に押し戻されます。これはクレイジーです!調整しようとしていますこれらの例ですが、
1 に答える
0
残念ながら、HTML5 / CSS3より前では、説明している内容を簡単に実現できないため、既知のソリューションは複雑です。それはクレイジーではありません、それは最先端です。A List Apartでソリューションを開発して説明した人々は、このようなものを理解する上で権威のある業界の専門家です。
私たちが持っている最良のオプションは、JavaScriptを使用して列サイズを計算し、実行時にレイアウトするか、純粋なCSSソリューションに必要な手動の調整に満足することです。ほとんどのサイトでは、JSを使用することをお勧めします。これは、適切な列レイアウトを「拡張」と見なすことができるためです。垂直方向に配置されたセマンティックマークアップは引き続き読み取り可能であり、SEOに最適化されており、JS対応のクライアントはそのマークアップを段階的に拡張してきれいにすることができます。 、3列のプレゼンテーション。
サイトが一般公開されており、一般的な人口統計分布がある場合、JSを有効にした状態で約90％を見ています。残りの10％は、サイトがあまりきれいではないか、見栄えがよくないことに慣れています。
于 2010-06-06T18:03:07.160 に答える