css 中的 clear 属性控制元素与前面浮动元素的关系:none:不受浮动元素影响;left:清除左侧浮动元素;right:清除右侧浮动元素;both:清除左右两侧浮动元素。
clear 在 CSS 中的含义
clear 在 CSS 中是一个属性,用于控制一个元素与它前面的浮动元素的关系。当一个元素浮动时,它会脱离正常文档流,允许后面的元素在其上方流动。clear 属性可以强制后面的元素出现在浮动元素的下方。
语法
<code class="<a href=" https: target="_blank">css">clear: none | left | right | both;</code>
值
- none: 元素不受前面浮动元素的影响。
- left: 元素清除左边的浮动元素。
- right: 元素清除右边的浮动元素。
- both: 元素清除左右两边的浮动元素。
示例
<code class="css">.container { width: 100%; } .float-left { float: left; width: 50%; } .no-clear { clear: none; } .left-clear { clear: left; } .right-clear { clear: right; } .both-clear { clear: both; }</code>
效果
-
.no-clear
不会清除前面的浮动元素,.float-left 将会出现在.no-clear
的上方。 -
.left-clear
会清除左边的浮动元素,.float-left 将会出现在.left-clear
的上方。 -
.right-clear
会清除右边的浮动元素,.float-left 将会出现在.right-clear
的下方。 -
.both-clear
会清除左右两边的浮动元素,.float-left 将会出现在.both-clear
的下方。
用法
clear 属性通常用于在浮动布局中控制元素的布局和顺序。它可以确保内容不会被浮动元素覆盖或遮挡。
原文来自:www.php.cn© 版权声明
文章版权归作者所有,未经允许请勿转载。
THE END
暂无评论内容