zoukankan      html  css  js  c++  java
  • CSS实现圆角的方法

     1 <style type="text/css">
     2 body,p,div {margin:0;padding:0;}
     3 .Box {margin:10px auto;width:500px;}
     4 /*淘宝的圆角方法*/
     5 .R-1-T,.R-1-B {height:6px;position:relative;background-image:url(http://images.cnblogs.com/cnblogs_com/jikey/round6.png);background-repeat:no-repeat;overflow:hidden;}
     6 .R-1-T {background-position:-6px 0;margin-bottom:-6px;}
     7 .R-1-B {background-position:-6px -6px;margin-top:-6px;}
     8 .R-1-T b,.R-1-B b {float:right;background-image:url(http://images.cnblogs.com/cnblogs_com/jikey/round6.png);background-repeat:no-repeat;height:6px;width:6px;text-indent:-9999px;}
     9 .R-1-T b {background-position:0 0;}
    10 .R-1-B b {background-position:0 -6px;}
    11 .R-1-C {border:1px solid #dfdfdf;padding:6px;}
    12 </style>
    13 <div class="Box">
    14 <p class="R-1-T"><b>圆角底部</b></p>
    15 <div class="R-1-C">内容在这里内容在这里内容在这里内容在这里内容在这里内容在这里内容在这里内容在这里内容在这里内容在这里内容在这里内容在这里</div>
    16 <p class="R-1-B"><b>圆角底部</b></p>
    17 </div>



    学习与分享div+css的平台:http://www.divcss5.com/

    文章摘自:http://www.cnblogs.com/jikey/archive/2010/05/20/1740366.html

  • 相关阅读:
    图解表连接
    python 开发学习
    学习路线
    前端开发学习路径(完整版)
    JSON.parse()与JSON.stringify()的区别
    npm介绍和使用
    jQ
    BOM
    javaScript 内置对象-Array数组
    Ajax
  • 原文地址:https://www.cnblogs.com/xiaomifeng/p/4497988.html
Copyright © 2011-2022 走看看