CSS 實現圓角表格

來源:互聯網
上載者:User
 1 <style type="text/css">
2 div#nifty{ filter:alpha(opacity=20);margin: 0 10%;background:#ECF5FF;}
3 p {filter:alpha(opacity=50);padding:10px}
4 div.rtop, div.rbottom{filter:alpha(opacity=50);display:block;background: #FFF}
5 div.rtop div, div.rbottom div{filter:alpha(opacity=50);display:block;height: 1px;overflow: hidden; background: #9BD1FA}
6 div.r1{filter:alpha(opacity=50);margin: 0 5px}
7 div.r2{filter:alpha(opacity=50);margin: 0 3px}
8 div.r3{filter:alpha(opacity=50);margin: 0 2px}
9 div.rtop div.r4, div.rbottom div.r4{margin: 0 1px;height: 2px}
10 </style>
11 <div id="nifty">
12 <div class="rtop"><div class="r1"></div><div class="r2"></div><div class="r3"></div><div class="r4"></div></div>
13 <p>無圖片的圓角表格</p>
14 <div class="rtop"><div class="r4"></div><div class="r3"></div><div class="r2"></div><div class="r1"></div></div>
15 </div>
相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.