容器包含若干浮动元素时如何清理浮动

藏色散人
Lepaskan: 2020-07-02 10:50:43
asal
3485 orang telah melayarinya

容器包含若干浮动元素时,清理浮动的方法就是在容器元素闭合标签前,添加额外元素并设置“clear: both”即可,而“clear:both”的意思就是清除浮动。

容器包含若干浮动元素时如何清理浮动

容器元素闭合标签前添加额外元素并设置clear: both

父元素触发块级格式化上下文

  • 块级格式化上下文,它是一个独立的渲染区域,这个区域与外部毫不相干。

触发条件:

  • 根元素(例如:html)

  • 元素浮动了(float 不为 none)

  • position 为 absolute 或 fixed

  • display 为 inline-block、table-sell、flex…

  • overflow 不为 visible

设置容器元素伪元素进行清理(推荐的清理浮动方法)

推荐学习:《前端视频

Atas ialah kandungan terperinci 容器包含若干浮动元素时如何清理浮动. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan