清除元素的默认属性,一般有两种方式:
* { margin: 0; padding: 0; box-sizing: border-box; }
这段代码会将页面中所有元素的 margin、padding、box-sizing 都设置为 0。这样就可以避免默认属性的干扰,确保页面元素的尺寸和位置都能按照预期进行计算。
.clearfix::after { content: ""; display: table; clear: both; }
这段代码是清除浮动的典型做法。在 HTML 中,浮动元素会影响周围元素的位置,可能导致布局混乱。使用 clearfix 类名包裹浮动元素,然后为其添加 ::after 伪元素,设置 content 和 display 属性,最后加上 clear: both,就可以将浮动元素的影响彻底清除。
当然,还有其他更灵活的清除元素的方法,比如使用 normalize.css 等框架来统一处理页面样式。无论使用哪种方法,都要保证清除元素属性的方式没有副作用,不会导致页面显示出现其他问题。