css内边距和外边距代码

CSS（层叠样式表）是前端开发中不可或缺的一部分，其中内边距和外边距是经常用到的常见属性。下面我们来详细了解一下这两个属性。

    p {
        margin: 20px;
        padding: 10px;
    }

在上面的代码中，margin和padding是CSS中控制内边距和外边距的属性。

首先，margin用来控制元素与周围元素的距离，即外边距。在上面的代码中，margin: 20px;将元素的外边距设置成了20像素，这意味着元素与周围元素之间至少有20像素的空隙。此外，我们也可以使用margin-top、margin-right、margin-bottom、margin-left单独控制元素的上、右、下、左外边距。

接着，padding用来控制元素的内边距，也就是元素内容和边界之间的空隙。在上面的代码中，padding: 10px;将元素的内边距设置成了10像素，这意味着元素的内容与边界之间至少有10像素的空隙。与margin类似，也可以使用padding-top、padding-right、padding-bottom、padding-left单独控制元素的上、右、下、左内边距。

需要注意的是，margin和padding并不会改变元素的大小，而是影响元素与周围元素或元素内容之间的距离。因此在使用这两个属性时，我们需要根据具体情况进行调整，以达到理想的页面效果。