首先介绍内边距，使用padding属性可以设置元素内容区域与边框之间的距离。下面是一个例子：
div {
padding: 10px;
}上面的代码将会使div元素内容区域四周分别有10像素的内边距。大家也可以分别指定每个方向的内边距：
div {
padding-top: 5px;
padding-bottom: 5px;
padding-left: 10px;
padding-right: 10px;
}这将会使div元素上下内边距均为5像素，左右内边距均为10像素。
然后是外边距，使用margin属性可以设置元素与周围元素之间的距离。下面是一个例子：
div {
margin: 20px;
}上面的代码将会使div元素与周围元素产生20像素的外边距，大家也可以分别指定每个方向的外边距：
div {
margin-top: 5px;
margin-bottom: 5px;
margin-left: 10px;
margin-right: 10px;
}这将会使div元素上下外边距均为5像素，左右外边距均为10像素。
需要注意的是，内外边距的使用是会相互影响的，例如在一个元素上同时设置内外边距时，元素宽高的计算就会受到约束。因此在设计中需要综合考虑内外边距设置的大小和数量，以达到最佳的排版效果。