border:它是“边框”的意思,边框有三个要素:粗细、线型、颜色;
说明:边框的颜色可以省略不写,但是如果不写的话就表示边框的颜色为黑色,其它的两个属性值不能不写如果不写的话就会不显示边框。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
.box{
width: 300px;
height: 300px;
margin: 100px auto;
/* 语法格式:border:粗细 线型 颜色 */
/* border: 5px solid #f90; */
border-top: 10px double #333333;
border-right: 10px dashed #00FFFF;
border-bottom: 10px solid #FF9900;
border-left: 10px dotted #00FF00;
}
</style>
</head>
<body>
<div class="box"></div>
</body>
</html>
其实边框也是有四个方位的:border-top:上边框;border-right:右边框;border-bottom:下边框;border-left:左边框.