对 div 盒子加一个边框样式很简单只需要使用 border 板块样式即可. 定义一个 CSS 选择器 ".div1{}", 在此选择器中设置 border 样式, 然后在要添加边框 border 样式的 div 中调用此 CSS 选择器即可.
一, 虚线与实线边框
边框虚线样式: dashed
边框实现样式: solid
border:1px dashed #000
代表设置对象边框宽度为 1px 黑色虚线边框
border:1px solid #000
代表设置对象边框宽度为 1px 黑色实现边框
二, 对 div 上边加边框
我们给 div 上边加 1px 黑色边框
div{border-top:1px solid #000}
三, 给 div 底部加边框
给 div 盒子底部加 2px 虚线红色边框
div{border-bottom:2px dashed #F00}
四, 在 div 盒子左侧加边框
给一个 CSS 选择器 CSS 命名为 ".div1" 盒子左侧加一个蓝色 1px 实线边框
.div1{ border-left:1px solid #00F}
DIV 代码:
<div class="div1"> 此 DIV 盒子左侧为 1px 实线蓝边框 </div>
五, 在盒子 div 右侧加边框
div 对象右侧加 1px 红色实线边框
div{ border-right:1px solid #F00}
六, 在盒子上下加边框
给盒子上下加 1px 实现黑色边框
div{border-top:1px solid #000;border-bottom:1px solid #000}
七, 给 div 盒子左右加边框
给盒子左右加 2px 虚线绿色边框
div{ border-left:2px dashed #0F0;border-right:2px dashed #0F0}
八, 给 div 四边加上一个边框
给一个 DIV 四边加上 3px 实现黑色边框
div{ border:3px solid #000}
来源: http://www.css88.com/qa/css3/11519.html