这篇博客详细介绍了CSS3中的线性渐变，包括从头部到底部、指定角度和方向的渐变方式，并提供了丰富的代码示例。此外，还讨论了重复线性渐变的用法以及不同浏览器的兼容性解决方案。
第一种 线性渐变
1.头部到底部
至少两种颜色，多了不限
background-image: linear-gradient(颜色1，颜色2.....);
代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<style>
#d1{
width:400px;
height:400px;
background-image: linear-gradient(pink,skyblue,gold);
}
</style>
</head>
<body>
<div id="d1"></div>
</body>
</html>
效果图如下
2.指定角度----逆时针
background-image: linear-gradient(角度值，颜色1，颜色2.....);
<!DOCTYPE html>
<html lang="en">
<head>
最低0.47元/天 解锁文章
扫一扫
429
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
