cssのfloatフローティング問題
以前はfloatの問題を理解したと思っていたが、しばらく使わないとは思わなかったし、忘れてしまったので、今日また調べて、記録しておきました.
すべてのサブエレメント(c)がフローティング(すなわちfloatが設定されている)すると、火狐の下で親エレメント(p)は高さがなくなり、下のエレメントは、上のfのように上に移動します.pの高さが0であるため、解決策は1です.f加clear:both.しかしpの高さはやはり0で、時には影響があって、例えばpが背景を設ける時、すべて設置できません.2.pの中にdiv(m)をもう1つ設けて、つまりcの親元素はmで、mの親元素はpで、それからmはfloatを設けて、それからmの上でpの使うものを設ければいいです.しかしネット上である人は言います(floatの要素、親の要素はfloatにしないほうがいいです.そうしないとbugがあります)これもあまりよくありません3.pはdivサブ要素を追加して、cと同級で、それからclear:bothでいいです.これでpも高くなります.しかし、divではなくdt、ddであれば、だめです.それはdivが値がないからです(すなわちテキストtext)のデフォルトは0ですが、幅はありますが、ddは高さも幅も0なのでclear:bothの場合は必ず幅を設定します.もちろんpにサブエレメントがブロックエレメントでなければ面倒ではありませんが、右側に浮動している場合は、浮動しているブロックエレメントをブロックエレメントではない前に書くことに注意してください.
もちろん以上は個人的な見解ですが、間違ったところがあるかもしれません.
<div class="p">
<div class="c"></div>
<div class="c"></div>
</div>
<div class="f"></div>
すべてのサブエレメント(c)がフローティング(すなわちfloatが設定されている)すると、火狐の下で親エレメント(p)は高さがなくなり、下のエレメントは、上のfのように上に移動します.pの高さが0であるため、解決策は1です.f加clear:both.しかしpの高さはやはり0で、時には影響があって、例えばpが背景を設ける時、すべて設置できません.2.pの中にdiv(m)をもう1つ設けて、つまりcの親元素はmで、mの親元素はpで、それからmはfloatを設けて、それからmの上でpの使うものを設ければいいです.しかしネット上である人は言います(floatの要素、親の要素はfloatにしないほうがいいです.そうしないとbugがあります)これもあまりよくありません3.pはdivサブ要素を追加して、cと同級で、それからclear:bothでいいです.これでpも高くなります.しかし、divではなくdt、ddであれば、だめです.それはdivが値がないからです(すなわちテキストtext)のデフォルトは0ですが、幅はありますが、ddは高さも幅も0なのでclear:bothの場合は必ず幅を設定します.もちろんpにサブエレメントがブロックエレメントでなければ面倒ではありませんが、右側に浮動している場合は、浮動しているブロックエレメントをブロックエレメントではない前に書くことに注意してください.
もちろん以上は個人的な見解ですが、間違ったところがあるかもしれません.