伪元素

最新推荐文章于 2025-02-11 14:01:08 发布

weixin_30487317

最新推荐文章于 2025-02-11 14:01:08 发布

阅读量107

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/zmeieasyjob/p/4220663.html

本文探讨了伪元素在解决浮动布局问题时的应用，详细解释了如何利用伪元素before和after来防止上边距崩塌和清除浮动，同时介绍了在HTML中遇到的Opera浏览器bug及其解决方案。

.container:before,
.container:after {
display: table;
content: " ";
}
这会产生伪元素。设置 display 为 table，会创建一个匿名的 table-cell 和一个新的块格式化上下文。:before 伪元素防止上边距崩塌，:after 伪元素清除浮动。
如果 conteneditable 属性出现在 HTML 中，由于一些 Opera bug，围绕上述元素创建一个空格。这可以通过使用 content: " " 来修复。

.container:after {
clear: both;
}
它创建了一个伪元素，并确保了所有的容器包含所有的浮动元素。

转载于:https://www.cnblogs.com/zmeieasyjob/p/4220663.html