Spiffy Corners - 用 CSS 建立不需圖片的圓角表格
文章發佈於 : 2007-05-18 11:48:32 | 文章分類 : 程式相關
標籤 :
程式相關
剛剛找到利用CSS就可以不需要作圓角圖,然後做出圓角的感覺.
突然覺得自己前幾天在搞圖片,難道是搞心酸的嗎...
就當做多學會一點東西吧.
Spiffy Corners 原始網站
<style type="text/css">
.spiffy{
display:block;
}
.spiffy *{
display:block;
height:1px;
overflow:hidden;
background:#0a67e6;
}
.spiffy1{
border-right:1px solid #95bdf4;
padding-right:1px;
margin-right:3px;
border-left:1px solid #95bdf4;
padding-left:1px;
margin-left:3px;
background:#478dec;
}
.spiffy2{
border-right:1px solid #e6effc;
border-left:1px solid #e6effc;
padding:0px 1px;
background:#3883ea;
margin:0px 1px;
}
.spiffy3{
border-right:1px solid #3883ea;
border-left:1px solid #3883ea;
margin:0px 1px;
}
.spiffy4{
border-right:1px solid #95bdf4;
border-left:1px solid #95bdf4;
}
.spiffy5{
border-right:1px solid #478dec;
border-left:1px solid #478dec;
}
.spiffy_content{
padding:0px 5px;
background:#0a67e6;
}
</style>
<div>
<b class="spiffy">
<b class="spiffy1"><b></b></b>
<b class="spiffy2"><b></b></b>
<b class="spiffy3"></b>
<b class="spiffy4"></b>
<b class="spiffy5"></b>
</b> <div class="spiffy_content">
<!-- Your Content Goes Here -->
</div>
<b class="spiffy">
<b class="spiffy5"></b>
<b class="spiffy4"></b>
<b class="spiffy3"></b>
<b class="spiffy2"><b></b></b>
<b class="spiffy1"><b></b></b>
</b>
</div>
Love is waiting so you don't have to. Join Date.com for free!
Join Asia FriendFinder the Largest Asian Dating Site on the Web for FREE!
Kaspersky Security for Internet Gateway 7.0
Know when to sell on eBay using research
ㄚ凱的回覆 @ 2007-05-18 12:05:20
阿維
