线性渐变属性
1.属性:backgorund
2.属性值:linear-gradient
3.关于线性渐变参数的使用:linear-gradient(参数)
- 线性渐变有多个参数,第一个参数表示方向,后面的参数都是颜色值(两个或者多个)
- 在小括号内的参数之间需要使用逗号隔开
4.线性渐变参数的使用方法(标准写法和兼容写法)
- 不写方向就是默认的方向,默认从上到下进行渐变
- 第一个参数是方向:可以设置边、角、角度
标准写法 兼容写法
属性: background background
属性值: linear-gradient -前缀-linear-gradient
方向1: to 结束的方向值 不加to 开始的方向
方向2: to 结束的对角 不加to 开始的对角
方向3: deg(角度) 90deg-标准的角度值
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
/* 标准写法 */
div{
width: 200px;
height: 200px;
background: linear-gradient(30deg,red,green)
}
/* 兼容写法 */
section{
width: 200px;
height: 200px;
background: -webkit-linear-gradient(60deg,red,green)
}
</style>
</head>
<body>
<div></div><br>
<section></section>
</body>
</html>