[分享]css内填充与内边距的区别

CSS内填充与内边距是我们常用的CSS属性，需要注意它们之间的区别。内填充内填充是指内容区域与边框之间的距离，可以同时设置上、下、左、右方向的距离。它会影响元素的大小。如：p{ padding: 10...

CSS内填充与内边距是我们常用的CSS属性，需要注意它们之间的区别。

内填充

内填充是指内容区域与边框之间的距离，可以同时设置上、下、左、右方向的距离。它会影响元素的大小。如：

p{
  padding: 10px;
} 

这样设置，会将段落内容与外边框保持10px的距离。

内边距

内边距是指元素边框与内容之间的空隙。注意，它与内填充不同，它不会影响元素的大小。如：

p{
  border: 1px solid red;
  padding: 10px;
} 

这样设置，会将段落内的内容与边框间保持10px的距离。

总结：

内填充会影响元素的大小，而内边距则不会影响元素的大小，只是在元素与边框之间添加空隙。

需要注意的是，在某些情况下，两者可能会重叠影响元素的整体布局效果。