css3使边框具有渐变的效果

最新推荐文章于 2024-07-22 13:45:23 发布

tarajk05

最新推荐文章于 2024-07-22 13:45:23 发布

阅读量2.6w

点赞数

分类专栏： html css

本文链接：https://blog.csdn.net/tarajk05/article/details/41961379

版权

html css 专栏收录该内容

18 篇文章 0 订阅

订阅专栏

css3中border-color属性包含有border-top-color, border-right-color, border-bottom-color , border-left-color四条边的属性设置。

使用CSS3的border-radius属性，可以设置边框不同的颜色。

如果你设置了border的宽度是X px，那么你就可以在这个border上使用X种颜色，每种颜色显示1px的宽度。如果说你的border的宽度是10个像素，但是只声明了5或6种颜色，那么最后一个颜色将被添加到剩下的宽度。

例子：

<!DOCMENT HTML>
<html>
    <head>
        <style>
            #one{width:300px;height:50px;border:10px solid green;-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;}
        </style>
    </head>
    <body>
        <div id="one"></div>
    </body>

</html>