5

こんにちは、私は CSS を学ぼうとしており、実際にどのように機能するかを学ぶために Web サイトのソースを調べています。先日960グリッドシステムに出会い、960gsフレームワークを使った本当に美しいサイトデザインを見つけました >> OneHub

この段階では、CSS をよりよく理解するまで、CSS フレームワークを使用することはあまり賢明ではないと思います。だから私の質問は、ブラウザの幅に合わせて拡大する背景を持つウェブサイトの中央にコンテンツボックスをどのように達成したかに関するものです.

firebug をインストールしましたが、サイトの div の理由がわかりません。#gutter、#navigation はブラウザの幅全体に拡張されます。これらの div が幅の値をどのように計算しているかわかりません。これは、どの子要素も十分に大きくないか、これらの div を強制的に大きくするルールを持っていないように見えるためです。

幅が 100% である理由がわかりません。CSS のどこかにマージン自動ルールまたは幅 100% が指定されているはずですが、見つかりません。960gsを使っている他のサイトも同じようなことをしているかもしれませんが、デザインがいいと思うので参考にさせていただきました。

私の質問が理にかなっていることを願っています。これについて何か助けてくれてありがとう

4

3 に答える 3

7

スタイルが設定されていない DIV は、常に親要素の 100% を占めます。それがボディ、またはブラウザ ウィンドウを埋める別の要素である場合、100% 埋められます。

これは「ブロック レベル」要素と呼ばれます。div、p、form、ul など、すべてのブロック レベル要素はこのように動作します。

于 2009-06-08T03:28:19.680 に答える
2

幅の規則を指定しない場合、幅はデフォルトで 100% になります。つまり、親要素を埋めるように拡張されます。この場合、親要素はボディであり、ビューポートの全幅でもあります。

于 2009-06-08T03:27:47.047 に答える
0

960グリッドシステムでは、ブラウザの幅全体を言うと、960pxを意味します。上記のrpfloに同意します。

于 2009-08-21T14:00:30.357 に答える