CSS3--线性渐变
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>CSS线性渐变--从上到下(默认情况)</title>
<style>
p{
width: 300px;
height: 400px;
/*第一个值方向,第二个起始为颜色*/
/*background: linear-gradient(red,blue);*/ /*默认*/
/*background:linear-gradient(to right,red,blue); */ /*从左到右*/
background: linear-gradient(to right bottom,red, yellow,blue); /*对角,左上角到右下角*/
}
</style>
</head>
<body>
<p>沿着一根轴线改变颜色,从起点到终点进行顺序渐变(从一边拉向另一边)</p>
</body>
</html>
效果: