边框 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> .box { width: 200px; height: 200px; background-color: #bfa; border: red solid 10px; border-right: none; } </style> </head> <body> <div class="box"></div> </body> </html> 1. 边框说明 大部分的浏览器中,边框的宽度和颜色都是有默认值的, 而边框的样式默认值都是 none .box { width: 200px; height: 200; background-color: #bfa; border-width: 10px; border-color: red; border-style: solid; border-right: none; } 2. 边框简写 边框的简写样式,通过它可以同时设置四个边框的样式,宽度,颜色 而且没有任何的顺序要求 border 一指定就是同时指定四个边不能分别指定可以单独设置四个边的样式,规则和 border 一样,不过它只对一个边生效 border-topborder-rightborder-bottomborder-left .box { width: 200px; height: 200; background-color: #bfa; /* border-top: 10px red solid; border-left: 10px red solid; border-top: 10px red solid; border-bottom: 10px red solid; border-left: 10px red solid;*/ border: red solid 10px; border-right: none; }