2007-03-13

纯CSS定义的圆角边框

关键字: css,xhtml
用这种纯CSS定义的圆角边框 好象不错  ，连小图片都省了
css 代码
 
  1. .xtop, .xbottom {display:block; background:transparent; font-size:1px;}  
  2. .xb1, .xb2, .xb3, .xb4 {display:block; overflow:hidden;}  
  3. .xb1, .xb2, .xb3 {height:1px;}  
  4. .xb2, .xb3, .xb4 {background:#ccc; border-left:1px solid #08c; border-right:1px solid #08c;}  
  5. .xb1 {margin:0 5px; background:#08c;}  
  6. .xb2 {margin:0 3px; border-width:0 2px;}  
  7. .xb3 {margin:0 2px;}  
  8. .xb4 {height:2px; margin:0 1px;}  
  9.   
  10. .xboxcontent {display:block; background:#ccc; border:0 solid #08c; border-width:0 1px;}  

xml 代码
 
  1. <div id="xsnazzy">  
  2.     <b class="xtop">  
  3.           <b class="xb1"></b>  
  4.           <b class="xb2"></b>  
  5.           <b class="xb3"></b>  
  6.           <b class="xb4"></b>  
  7.     </b>  
  8.     <div class="xboxcontent">  
  9.   
  10.     </div>  
  11.     <b class="xbottom">  
  12.            <b class="xb4"></b>  
  13.            <b class="xb3"></b>  
  14.            <b class="xb2"></b>  
  15.            <b class="xb1"></b>  
  16.     </b>  
  17. </div>  
评论
kryptonum 2007-03-14
Tiger，有进步啊
发表评论

您还没有登录，请登录后发表评论

tiger.passion
搜索本博客
我的相册
636a5d3f-1fce-3bb9-89d8-b13e5c6318d4-thumb
w3c01
共 46 张
存档
最新评论