邊框顏色漸變效果
代碼如下:
<!doctype html> <html> <head> <meta charset="UTF-8"> <title>Border-color</title> </head> <body> <div style="border: 8px solid #000; -moz-border-bottom-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc; -moz-border-top-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc; -moz-border-left-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc; -moz-border-right-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc; padding: 5px 5px 5px 15px;"> 在Firefox瀏覽器里能看到邊框顏色漸變效果 </div> </body> </html>
border:?
8px?solid表示邊框8像素的實(shí)線(solid) 顏色為黑
-moz-border-bottom-colors:(向下)
設(shè)置了border的寬度是X px，那么你就可以在這個(gè)border上使用X種顏色，每種顏色顯示1px的寬度。如果說(shuō)你的border的寬度是10個(gè)像素，但是只聲明了5或6種顏色，那么最后一個(gè)顏色將被添加到剩下的寬度。
效果展示:
