css边框属性详细总结-创新互联
元素外边距内就是元素的的边框 (border)。元素的边框就是围绕元素内容和内边据的一条或多条线.
边框的样式 (border-style)
样式是边框最重要的一个方面，这不是因为样式控制着边框的显示（当然，样式确实控制着边框的显示），而是因为如果没有样式，将根本没有边框。
a,css 边框样式分为10种不同的非inherit样式：如下：
统一风格
1，none 无边框
2，solid 直线边框
3，dashed 虚线边框
4，dotted 点状边框
5，double 双虚线边框
6，groove 凸槽边框
7，ridge 垄状边框
8，inset inset边框
9，outset outset边框
10，inherit继承
b,定义单边样式 分为以下4种样式
单独风格
1，border-bottom-style 下边边框样式
2，border-top-style 上边边框样式
3，border-left-style 左边边框样式
4，border-right-style 右边边框样式
因此这两种方法是等价的：
p {border-style: solid solid solid none;}
p {border-style: solid; border-left-style: none;}
注意：如果要使用第二种方法，必须把单边属性放在简写属性之后。因为如果把单边属性放在 border-style 之前，简写属性的值就会覆盖单边值 none。
边框宽度（border-width）
统一风格
border-width属性值：
1，thin 细边框
2，medium中等边框
3，thick粗边框
4，px固定值边框
5，inherit 继承
p {
border-style: solid;
border-width: thick;
}
等同于
p {
border-style: solid;
border-width: 5px;
}
单边宽度
p {
border-style: solid;
border-width: 15px 5px 15px 5px;
}
也等同于
p {
border-style: solid;
border-top-width: 15px;
border-right-width: 5px;
border-bottom-width: 15px;
border-left-width: 5px;
}
边框颜色（border-color）
统一风格
p {
border-style: solid;
border-color: blue red;
}
单独风格
1，border-top-color 上边框颜色
2，border-bottom-color 下边框颜色
3，border-left-color 左边框颜色
4，border-right-color 有边框颜色
h2 {
border-style: solid;
border-color: black;
border-right-color: red;
}
另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。
文章名称：css边框属性详细总结-创新互联
网页URL：http://scyanting.com/article/jjppo.html
