1、第一步，在HBuilder开发工具创建静态页面border.html，并修改title内容，如下图所示：
2、第二步，在body元素内插入五个div，其中一个div包裹另外四个div，如下图所示：
3、第三步，添加第一个div样式
.one{
width: 400px;
height: 100px;
color: #FF0000;
border-width: 2px;
border-bottom: 1px solid #D2691E;
}
如下图所示：
4、第四步，添加第二个div元素，设置顶部边框样式
.two{
width: 400px;
height: 100px;
color: #000000;
border-width: 3px;
border-top: 1px dashed #7FFFD4;
}
如下图所示：
5、第五步，添加第三个div样式，设置左边框样式，
.three{
width: 400px;
height: 100px;
color: #ED9898;
border-width: 4px;
border-left: 1px dotted #8A2BE2;
}
如下图所示：
6、第六步，设置最后一个div元素，设计右边框样式、颜色和宽度，
.four{
width: 400px;
height: 100px;
color: #DEB887;
border-width: 5px;
border-right: 1px double darkcyan;
}
如下图所示：
