1.border-width不支持百分比
可能的值：thin(1px);medium(3px默认值);thick(5px);length(自定义)；inherit(继承)。
2.border-style
（1）：none
（2）：solid(实线)
（3）：double(双线)
。。。
3.border-color
默认值为color
实际应用：
1,画三角形图标
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
.main{width:100px;height:100px;border:40px solid;border-color:red blue yellow green;}
</style>
</head>
<body>
<div class="main"></div>
</body>
</html>
border交界处是45°平分的，所以就有
.main{width:0px;border:100px solid;border-color:red transparent transparent transparent;}
30°直角三角形
.main{width:0px;border-width:20px 40px;border-style:solid;border-color:transparent red red transparent;}
任意三角形
<style type="text/css">
.main{width:0px;border-width:200px 400px;border-style:solid;border-color:transparent red red transparent;position: relative;}
.content{width:0px;border-width:360px 400px ;border-style:solid;border-color:transparent #fff #fff transparent;position: absolute;top: -200px;left: -400px;}
</style>
</head>
<body>
<div class="main">
<div class="content"></div>
</div>
</body>
2.三道杠图形
.main{width:100px;height:20px;border-top:60px double red;border-bottom: 20px solid red;}
