CSS中的内边距用padding表示,外边距用margin表示。两者都可以设置上下左右四个方向的数值。
/* 设置上下左右内边距为10px */ padding: 10px; /* 设置上下内边距为10px,左右内边距为20px */ padding: 10px 20px; /* 设置上内边距为10px,左右内边距为20px,下内边距为30px */ padding: 10px 20px 30px; /* 设置上内边距为10px,右内边距为20px,下内边距为30px,左内边距为40px */ padding: 10px 20px 30px 40px;
同样,外边距也可以按照同样的方式进行设置。
/* 设置上下左右外边距为10px */ margin: 10px; /* 设置上下外边距为10px,左右外边距为20px */ margin: 10px 20px; /* 设置上外边距为10px,左右外边距为20px,下外边距为30px */ margin: 10px 20px 30px; /* 设置上外边距为10px,右外边距为20px,下外边距为30px,左外边距为40px */ margin: 10px 20px 30px 40px;
值得注意的是,虽然内外边距使用方式相似,但是它们的含义是不同的。内边距是元素内容与元素边框之间的距离,而外边距是元素边框与相邻元素边框之间的距离。在实际使用过程中,大家需要根据元素的具体情况来选择是使用内边距还是外边距。