現(xiàn)在我們來看一看如何為邊框的border-color添加更多的色彩。
使用CSS3的border-radius屬性，如果你設(shè)置了border的寬度是X px，那么你就可以在這個(gè)border上使用X種顏色，每種顏色顯示1px的寬度。如果說你的border的寬度是10個(gè)像素，但是只聲明了5或6中顏色，那么最后一個(gè)顏色將被添加到剩下的寬度。
瀏覽器兼容性
目前只有Firefox支持CSS3 border-colour屬性，所以我們這里只需使用-moz前綴。
所有本系列關(guān)于CSS3的文章都會及時(shí)更新，以跟蹤瀏覽器的兼容性。
CSS3中的邊框顏色
這里是一個(gè)10px寬的標(biāo)準(zhǔn)邊框和邊框顏色：
#borderColor {
border: 10px solid #dedede;
-moz-border-bottom-colors: #300 #600 #700 #800 #900 #A00;
-moz-border-top-colors: #300 #600 #700 #800 #900 #A00;
-moz-border-left-colors: #300 #600 #700 #800 #900 #A00;
-moz-border-right-colors: #300 #600 #700 #800 #900 #A00;
padding: 15px 25px;
height: inherit;
width: 590px;
}
有圓角的邊框顏色
#borderColorCorner {
border: 10px solid #dedede;
-moz-border-radius: 15px;
-moz-border-bottom-colors: #303 #404 #606 #808 #909 #A0A;
-moz-border-top-colors: #303 #404 #606 #808 #909 #A0A;
-moz-border-left-colors: #303 #404 #606 #808 #909 #A0A;
-moz-border-right-colors: #303 #404 #606 #808 #909 #A0A;
padding: 15px 25px;
height: inherit;
width: 590px;
}
【網(wǎng)站聲明】本站除付費(fèi)源碼經(jīng)過測試外，其他素材未做測試，不保證完整性，網(wǎng)站上部分源碼僅限學(xué)習(xí)交流，請勿用于商業(yè)用途。如損害你的權(quán)益請聯(lián)系客服QQ：2655101040 給予處理，謝謝支持。