CSS2/CSS3边框样式：border有哪些属性值？

CSS border 属性允许您指定元素边框的样式、宽度和颜色。

CSS边框 border

1.设置边框样式：

border-style:样式；

可选的样式有：none 无边框 ，dotted 虚线边框 ，dashed 虚线边框 ，solid 实线边框 ，double 双边框 ，groove 凹槽边框， ridge 垄状边框 ，inset 嵌入边框 ，outset 外凸边框 ，hidden 隐藏边框

border-top-style:none; 上边框样式

border-bottom-style:solid; 下边框样式

border-left-style: dashed； 左边框样式

border-right-style:double; 右边框样式

border-style:dotted solid dashed double; （上右下左边框）

2.设置边框宽度：

边框宽度不能单独设置，必须在设置了边框样式后宽度才会生效

border-width:1px; 宽度为1像素的边框

border-top-width:15px; 上边框15像素

border-bottom-width:15px; 下边框

border-left-width:15px; 左边框

border-right-width:15px; 右边框

CSS轮廓 outline

outline（轮廓）是绘制于元素周围的一条线，位于边框边缘外围，可以起到突出元素的作用 可以设置的属性有 颜色 样式 宽度

1、轮廓颜色

outline-color：red；

2.轮廓样式

outline-style：样式值；

样式值参考如下：

none 默认。定义无轮廓。

dotted 定义点状的轮廓。

dashed 定义虚线轮廓。

solid 定义实线轮廓。

double 定义双线轮廓。双线的宽度等同于 outline-width 的值。

groove 定义 3D 凹槽轮廓。此效果取决于 outline-color 值。

ridge 定义 3D 凸槽轮廓。此效果取决于 outline-color 值。

inset 定义 3D 凹边轮廓。此效果取决于 outline-color 值。

outset 定义 3D 凸边轮廓。此效果取决于 outline-color 值。

3、轮廓宽度：

outline-width：宽度值；

可能出现的宽度值参考如下；

thin 规定细轮廓。

medium 默认。规定中等的轮廓。

thick 规定粗的轮廓。

length 允许您规定轮廓粗细的值。

CSS外边距 margin

1、什么是外边距

外边距控制块级元素之间的距离，他们是透明不可见的，包括margin-top, margin-right, margin-bottom, margin-left

2.外边距的写法

（1）margin: 40px 30px 20px 10px; 上右下左

（2）margin:30px 40px 20px; 上 左右 下

（3）margin:30px 40px; 上下 左右

（4）margin:40px; 上下左右

3.可能的值

（1）length 规定具体单位记的外边距长度

（2）% 基于父元素的宽度的外边距的长度

（3）auto 浏览器计算外边距

四、CSS内边距padding

1.什么是内边距

控制块级元素内部content和border之间的距离

2、常用写法

（1）padding: 40px 30px 20px 10px; 上右下左

（2）padding:30px 40px 20px; 上 左右 下

（3）padding:30px 40px; 上下 左右

（4）padding:40px; 上下左右

3.可能取的值

（1）length 规定具体单位记的外边距长度

（2）% 基于父元素的宽度的外边距的长度

（3）auto 浏览器计算外边距