日期:2014-05-17  浏览次数:20725 次

【网站制作视频教程】-第23讲 css列表-边框详解!-传智播客

网页设计视频教程下载地址:http://icd.itcast.cn/icd/video.shtml?from=wl

概要:
 
看到许多网站的边框许多是圆角的,很漂亮,可是我作图本领不行,所以想想能不能用css实现呢?经过一番搜索,有了发现.主要原理大概是线条的重叠.下面做一番分析,如果有不妥,希望各位能纠正,在此先谢过了.

  1.   CSS代码:
 1 <HTML>
 2 
<HEAD>
 3 
<style>
 4 .b1,.b2,.b3,.b4,.b1b,.b2b,.b3b,.b4b,.b{display:block;overflow:hidden;}

 5 .b1,.b2,.b3,.b1b,.b2b,.b3b{height:1px;}
 6 .b2,.b3,.b4,.b2b,.b3b,.b4b,.b{border-left:1px solid #999;border-right:1px solid #999;}
 7 .b1,.b1b{margin:0 5px;background:#999;}
 8 .b2,.b2b{margin:0 3px;