padding和margin的区别

8个月前发布

130

padding是内边距是作用于自身元素
margin是外边距作用的是自身以外的元素

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .padding {
            width: 100px;
            height: 100px;
            background: red;
            padding: 20px;
        }

        .margin {
            width: 100px;
            height: 100px;
            background: antiquewhite;
            margin: 20px;
        }
    </style>
</head>

<body>
    <div class="padding">
        <h2>padding</h2>
    </div>
    <div class="margin">
        <h2>margin</h2>
    </div>
</body>

</html>

1人已评分

padding和margin的区别

网页三剑客