2026-Css忘掉一切、归零再启

//清除浏览器的默认样式
 *{
        padding: 0;
        margin: 0;
        box-sizing: border-box;
    }

1. box-sizing

想要搞清楚box-sizing的作用，首先要搞清楚一个问题，在网页中我们平常给元素或标签设置的宽高到底指哪一部分？ 在网页中的元素或标签在网页中都会生成一个盒模型，平常所设置的宽高指的是盒模型内容部分的宽高如下图

2.box-sizing: border-box; 之后

总结

1. box-sizing有两个值content-box、border-box，页面不设置默认：box-sizing: content-box;宽高设置的是内容部分

2. box-sizing: border-box;宽高:padding + border + 内容区域