css控制文字颜色渐变

来源:互联网 发布:淘宝200元和300元的鞋 编辑:程序博客网 时间:2024/06/05 11:34

<style>

div {

width: 200px;
height: 100px;
margin-top: 10px;
border: 1px solid #ddd;
}
.test {
background: linear-gradient(#fff, #000);黑白渐变
}
.test2 {
background: linear-gradient(#fff, #f00 50%, #000);白红黑渐变,平均分
}
.test3 {
background: linear-gradient(0deg角度, #fff20%, #f00 50%, #000 80%);
}
.test4 {
background: linear-gradient(45deg角度, #fff, #f00 50%, #000);
}
.test5 {
background: linear-gradient(to top right 朝着右上角, #fff, #f00 50%, #000);

}
</style>
</head>
<body>

<div class="test"></div>
<div class="test2"></div>
<div class="test3"></div>
<div class="test4"></div>

<div class="test5"></div>

</body>