1.整体样式
下面详细介绍一下border-width、border-style以及border-color属性
border-width属性用于定义边框的宽度，取值是一个像素值border-style属性用于定义边框的外观
border-color属性用于定义边框的颜色
简写形式：
想要为一个元素定义边框，我们需要完整地给出border-width、border-style和bordercolor。这种写法代码量过多，费时费力。不过CSS为我们提供了一种简写形式
border:1px solid red;
上面的代码其实等价于下面的代码：
border-width:1px;
border-style:solid;
border-color:red;
示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style type="text/css">
div {
border: 1px solid blue;
}
</style>
</head>
<body>
<div>你好世界</div>
</body>
</html>
2.局部样式
一个元素其实有4条边（上、下、左、右）
- 上边框
border-top - 下边框
border-bottom - 左边框
border-left - 右边框
border-right
如下语句可以为四个边框设置不同的样式：
border-top: 1px solid blue;
border-bottom: 1px solid red;
border-left: 1px solid purple;
border-right: 1px solid pink;
版权声明：本文为Gherbirthday0916原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。