「这是我参与2022首次更文挑战的第9天，活动详情查看：2022首次更文挑战」
一、外边距
外边距也称外布丁，外边距设置属性有margin-top、margin-right、margin-bottom、margin-left，可分别设置，也可以用margin属性，一次设置所有边距。
（1）上外边距（margin-top）
语法：margin-top：length | auto
参数：length是由数字和单位标识符组成的长度值或者百分数，百分数是基于父对象的高度。auto值被设置为对边的值。
说明：设置对象上外边距，外边距始终透明。内联元素要使用该属性，必须先设定元素的height或width属性，或者设定position属性为absolute。
示例：
body {margin-top:11.5%;}
（2）右外边距（margin-right）
语法：margin-right：length | auto
参数：同margin-top。
说明：同margin-top。
示例：
body {margin-right:11.5%;}
（3）下外边距（margin-bottom）
语法：margin-bottom ：length | auto
参数：同margin-top。
说明：同margin-top。
示例：
body {margin-bottom:11.5%;}
（4）左外边距（margin-left）
语法：margin-left ：length | auto
参数：同margin-top。
说明：同margin-top。
示例：
body {margin-left:11.5%;}
以上4项属性可以控制一个要素四周的边距，每一个边距都可以有不同的设置。或者设置一个边距，然后让浏览器用默认设置设定其他几个边距。可以将边距应用于文字和其他元素。
示例：
h4{margin-top:20px;margin-bottom:5px;margin-left:100px;margin-right:55px}
设定边距参数值最常用的方法是利用长度单位（px、pt等），也可以用比例值设定边距。将边距值设为负值，就可以将两个对象叠在一起，例如把下边距设为-55px，右边距为60px。
（5）外边距（margin）
语法：margin ：length | auto
参数：length是由数字和单位标识符组成的长度值或者百分数，百分数是基于父对象的高度；对于内联元素来说，左右外边距可以是负数值。auto值被设置为对边的值。
说明：设置对象四边的外边距，位于盒模型的最外层，包括4项属性：margin-top（上外边距）、margin-right（右外边框）、margin0-bottom（下外边距）、margin-left（左外边距），外延边距始终是透明的。如果提供全部4个参数值，将按margin-top（上）、margin-right（右）、margin0-bottom（下）、margin-left（左）的顺序作用于4边（顺时针）。每个参数中间用空格分隔。
二、边框
常用的边框属性有7项：border-top、border-right、border-bottom、border-left、border-width、border-color、border-style。其中border-width可以一次性设置所有的边框宽度，border-color同时设置四面边框的颜色时，可以连续写上4种颜色，并用空格分隔。上述连续设置的边框都是按border-top、border-right、border-bottom、border-left的顺序（顺时针）。
（1）所有边框宽度（border-width）
语法：border-width ：medium | thin | thick | length
参数：medium为默认宽度，thin为小于默认宽度，thick为大于默认宽度。length由数字和单位标识符组成的长度值，不可为负值。
示例：
span{border-style:solid;border-width:thin}
span{border-style:solid;border-width:1px thin}
（2）边框样式（border-style）
语法：border-style :none |hidden|dotted|dashed|solid|double|groove|ridge|inset|outset
参数：border-style属性包括了多个边框样式的参数。
none：无边框。与任何指定的border-width值无关。
dotted：边框为点线。
dashed：边框为长短线。
solid：边框为实线。
double：边框为双线。两条单线与其间隔的和等于指定的border-width值。
groove：根据border-color的值画3D凹槽。
ridge：根据border-color的值画菱形边框。
inset：根据border-color的值画3D凹边。
outset：根据border-color的值画3D凸边。
（3）边框颜色（border-color）
语法：border-color：color
参数：color指定颜色。
（4）上边框宽度（border-top）
语法：border-top：border-width||border-style||border-color
（5）右边框宽度（border-right）
语法：border-right：border-width||border-style||border-color
（6）下边框宽度（border-bottom）
语法：border-bottom：border-width||border-style||border-color
（7）左边框宽度（border-left）
语法：border-left：border-width||border-style||border-color
三、内边距
内边距也称内补丁，位于对象边框和对象之间，用于设置边框与内容之间的距离。内边距包括了4项属性：padding-top（上内边距）、padding-right（右内边距）、padding-bottom（下内边距）、padding-left（左内边距），内边距属性不允许负值。与外边距相似，内边距也可以用padding一次性设置所有的对象间隙，格式也和margin相似，不再一一列举。
