zoukankan      html  css  js  c++  java
  • mojoportal学习——文章翻译之 制作圆角

    翻译的不好 大家见谅


     一种方法是使用图片,如下模板中
     
     graformix-orange
     graformix-company
     freecsstemplates-level2
     mmcgee-uncreativesuite
     styleshout-refresh, styleshout-coolwater, styleshout-envision uses images only for rounding the outer container

    一种方法是实用html+css

    如下模板中:
     dcarter-businessone
     dcarter-sq2
     dcarter-ticktockpro
     mitchinson-earthy
     mitchinson-earthy-alt1
     ramblingsoul-5contentpanes
     ramblingsoul-colorpencils
     snop-plasticboy-reflection
     viktorpersson-thehobbit
     
     在aspx或ascx文件中顶端添加:
     <mp:CornerRounderTop id="ctop1" runat="server" EnableViewState="false" />
     
     低端添加:
     <mp:CornerRounderBottom id="cbottom1" runat="server" EnableViewState="false" />
     
     他们将会产生如下代码:
     (上面的:)
     
     <div class='rtop'><div class='r1'></div><div class='r2'></div><div class='r3'></div><div class='r4'></div></div>

       (下面的:)

    <div class='rbottom'><div class='r4'></div><div class='r3'></div><div class='r2'></div><div class='r1'></div></div>

    相关的CSS代码:

    .rtop, .rbottom{display: block;}
    .rtop, .rbottom{background: #E4DCB2;}
    .rtop .r1, .rtop .r2, .rtop .r3, .rtop .r4,
    .rbottom .r1, .rbottom .r2, .rbottom .r3, .rbottom .r4{background: #9C9473;}
    .rtop .r1, .rtop .r2, .rtop .r3, .rtop .r4,
    .rbottom .r1, .rbottom .r2, .rbottom .r3, .rbottom .r4
    { display: block;height: 1px;overflow: hidden; }
    .r1{margin: 0 5px}
    .r2{margin: 0 3px}
    .r3{margin: 0 2px}
    .rtop .r4, .rbottom .r4{ margin: 0 1px; height: 2px }
    .rbottom { margin-bottom:10px; }

  • 相关阅读:
    繁体解决方案一,ASP,JSP,PHP,DotNet任何开发通用
    18.观察者模式(Observer Pattern)
    存储过程小技巧(2)从动态查询SQL中返回值给变量
    DotNet学习
    询问:有没有用C#写的C/S模式下的网页编辑工具
    dotNet繁体解决方案
    svn感叹号大全
    svn中出现红色感叹号
    Varnish配置,Error 503解决之道
    varnish清除缓存的方法
  • 原文地址:https://www.cnblogs.com/wenjie/p/1853634.html
Copyright © 2011-2022 走看看