2つのDIVが1つの大きなDIVに並んでいる
今日突然レイアウトの問題に遭遇しました.私たちのようなWeb制作ソフトを使わない人にとって、これは时には本当に大きな難題です.
問題のように、やっと解決した.
cssコードは次のとおりです.
htmlコード:
効果図:
ある大神の評論を見て、私にこの菜鳥にまた道を指して、これは浮動をクリアしなければなりません.
Webサイト:http://zhidao.baidu.com/question/116485969.html
内容:============================================================
clearはサブモジュール間で限定され、
次のようになります.
1と2の間は、clearで限定されます.overflow:hiddenは親モジュール対サブモジュールで使用されます.aは1と2モジュールに対する限定である.clearはとてもよく理解して、主にoverflow:hiddenはこんなによく理解していません.私は文章を送ってあなたに見せて、これはあなたが見終わったらとても意味が分かります.overflow:hiddenというCSSスタイルはよく使われるCSSスタイルですが、多くの人がこのスタイルに対する理解はオーバーフローを隠すことに限られており、フローティングをクリアする意味についてはよく知られていません.フローティングのクリアといえば、もう一つのCSSスタイル:clear:bothを思い浮かべます.この属性の理解は問題ないと信じています.しかし、「浮動」という言葉にはいったいどんな意味が含まれているのだろうか.以下、詳しく説明します.これはよく使われるdivの書き方で、次はスタイルを書きます.みんなはDMXの中で自分で実験をすることができます#wai{width:500 px;background:#000;height:500 px;}#nei { float:left; width:600px; height:600px; background:red;}私はneiというidにフローティングを追加したことを見ることができます.私たちの一般的な理解では、neiというidのdivの右側にwaiというdivとneiというdivの残りの値を超えない限り、他の内容が現れることを許可します.div waiに他のdivが含まれている場合、neiの右側に表示することを許可しません.スタイルclear:bothでこのdivを指定し、neiの右側にフローティングすることを許可しません.これらはie 6の中で正しいです.しかし、火狐や他のブラウザでは、問題はそんなに簡単ではないことがわかりました.neiというdivの幅と高さがwaiというdivより大きい場合,waiは内側に押し開かれず,依然として私たちに指定された幅の高さを示していることが分かった.私の例では、すべて500です.この時私は理解していません.私は多くの資料を検索しましたが、それがなぜなのか理解できませんでした.他の人が似たような状況でwaiというdivにoverflow:hiddenという属性を加えてこの問題を解決したのを見るまで.私たちはoverflow:hiddenという属性の役割がオーバーフローを隠すまで、waiにこの属性を加えると、私たちのneiの幅が自動的に隠されます.また,waiというdivの高さ値を削除する実験を行ったところ,waiの高さはneiというdivの高さ値に自動的に支えられていることが分かった.ここまで言うと、「浮動」という言葉の意味を理解してみましょう.私たちの元の理解は、平面上の浮動ですが、この実験を通じて、これは平面上の浮動だけでなく、立体的な浮動であることを発見しました.すなわち,neiというdivにフローティングという属性を加えると,ディスプレイの側面ではwaiというdivから離れている,すなわち,このときのneiの幅がどれだけあるかは,すでに離れたwaiにとっては役に立たない.イメージを表す比喩として、JJがBBから離れたとき、JJの大きさはBBには支えられていない(少し不快な感じがする--||)OKで、浮動という言葉の意味を全面的に理解したとき、overflow:hiddenという属性の解釈を理解し、浮動を取り除くのはどういう意味かを理解しました.すなわち,waiというdivにoverflow:hiddenという属性を加えると,neiなどのフローティング属性を持つdivのこの立体的なフローティングはクリアされ,JJがBB内に入ったように,JJの大きさは自然にBBの大きさに影響を及ぼす.これがoverflow:hiddenという属性がフローティングをクリアする正確な意味です.waiというdivに高さを設定していない場合、neiというdivの高さは、waiというdivを広げますが、別の側面では、waiというdivに高さ値を加えると、neiというdivの高さがいくらであっても、waiという高さは私たちが設定した値であることに注意してください.neiの高さがwaiの高さを超えると、超えた部分が隠されます.溢れ出す意味を隠す!私は、私のこれらの文字を通じて、overflow:hiddenという属性について新しい認識を持っていると信じています.私と同じように、div+cssの勉強の中で絶えず進歩することを望んでいます!
問題のように、やっと解決した.
cssコードは次のとおりです.
#page
{
margin:0 25% 0 25%;
padding: 10px 10px;
border-style:dashed;
height:500px;
}
#header
{
margin: 0 atuo;
height: 100px;
border-style:dashed;
text-align:center;
}
#search
{
margin: 10px 0;
border-style:dashed;
height :50%;
width:45%;
float:left;
}
#search2
{
margin: 10px 0;
border-style:dashed;
height :50%;
width:45%;
float:right;
}
htmlコード:
ニュース プラットフォーム
効果図:
ある大神の評論を見て、私にこの菜鳥にまた道を指して、これは浮動をクリアしなければなりません.
Webサイト:http://zhidao.baidu.com/question/116485969.html
内容:============================================================
clearはサブモジュール間で限定され、
次のようになります.
1と2の間は、clearで限定されます.overflow:hiddenは親モジュール対サブモジュールで使用されます.aは1と2モジュールに対する限定である.clearはとてもよく理解して、主にoverflow:hiddenはこんなによく理解していません.私は文章を送ってあなたに見せて、これはあなたが見終わったらとても意味が分かります.overflow:hiddenというCSSスタイルはよく使われるCSSスタイルですが、多くの人がこのスタイルに対する理解はオーバーフローを隠すことに限られており、フローティングをクリアする意味についてはよく知られていません.フローティングのクリアといえば、もう一つのCSSスタイル:clear:bothを思い浮かべます.この属性の理解は問題ないと信じています.しかし、「浮動」という言葉にはいったいどんな意味が含まれているのだろうか.以下、詳しく説明します.これはよく使われるdivの書き方で、次はスタイルを書きます.みんなはDMXの中で自分で実験をすることができます#wai{width:500 px;background:#000;height:500 px;}#nei { float:left; width:600px; height:600px; background:red;}私はneiというidにフローティングを追加したことを見ることができます.私たちの一般的な理解では、neiというidのdivの右側にwaiというdivとneiというdivの残りの値を超えない限り、他の内容が現れることを許可します.div waiに他のdivが含まれている場合、neiの右側に表示することを許可しません.スタイルclear:bothでこのdivを指定し、neiの右側にフローティングすることを許可しません.これらはie 6の中で正しいです.しかし、火狐や他のブラウザでは、問題はそんなに簡単ではないことがわかりました.neiというdivの幅と高さがwaiというdivより大きい場合,waiは内側に押し開かれず,依然として私たちに指定された幅の高さを示していることが分かった.私の例では、すべて500です.この時私は理解していません.私は多くの資料を検索しましたが、それがなぜなのか理解できませんでした.他の人が似たような状況でwaiというdivにoverflow:hiddenという属性を加えてこの問題を解決したのを見るまで.私たちはoverflow:hiddenという属性の役割がオーバーフローを隠すまで、waiにこの属性を加えると、私たちのneiの幅が自動的に隠されます.また,waiというdivの高さ値を削除する実験を行ったところ,waiの高さはneiというdivの高さ値に自動的に支えられていることが分かった.ここまで言うと、「浮動」という言葉の意味を理解してみましょう.私たちの元の理解は、平面上の浮動ですが、この実験を通じて、これは平面上の浮動だけでなく、立体的な浮動であることを発見しました.すなわち,neiというdivにフローティングという属性を加えると,ディスプレイの側面ではwaiというdivから離れている,すなわち,このときのneiの幅がどれだけあるかは,すでに離れたwaiにとっては役に立たない.イメージを表す比喩として、JJがBBから離れたとき、JJの大きさはBBには支えられていない(少し不快な感じがする--||)OKで、浮動という言葉の意味を全面的に理解したとき、overflow:hiddenという属性の解釈を理解し、浮動を取り除くのはどういう意味かを理解しました.すなわち,waiというdivにoverflow:hiddenという属性を加えると,neiなどのフローティング属性を持つdivのこの立体的なフローティングはクリアされ,JJがBB内に入ったように,JJの大きさは自然にBBの大きさに影響を及ぼす.これがoverflow:hiddenという属性がフローティングをクリアする正確な意味です.waiというdivに高さを設定していない場合、neiというdivの高さは、waiというdivを広げますが、別の側面では、waiというdivに高さ値を加えると、neiというdivの高さがいくらであっても、waiという高さは私たちが設定した値であることに注意してください.neiの高さがwaiの高さを超えると、超えた部分が隠されます.溢れ出す意味を隠す!私は、私のこれらの文字を通じて、overflow:hiddenという属性について新しい認識を持っていると信じています.私と同じように、div+cssの勉強の中で絶えず進歩することを望んでいます!