关于css中的box-sizing:border-box

最新推荐文章于 2021-03-14 10:59:37 发布

AdleyTales

最新推荐文章于 2021-03-14 10:59:37 发布

阅读量1.1w

点赞数

文章标签： css

本文为博主原创文章，未经博主允许不得转载。 Email: adleytales@126.com

本文链接：https://blog.csdn.net/adley_app/article/details/78456602

版权

box-sizing: border-box 会直接将border 和padding 放到盒子里面。

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style type="text/css">
        div{
            border: 1px solid #f00;
            width: 300px;
            height: 300px;
            padding: 0 15px;
            box-sizing: border-box;
        }
    </style>
</head>
<body>
    <div></div>
</body>
</html>