请老师说下解题思路和这个代码对不
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>线性渐变</title>
<style type="text/css">
div{
width:400px;height:400px;border:1px solid red;
/*补充代码，给div元素设置背景渐变*/
background-image:linear-gradient(90deg,rgba(255,0,0,0) 20%,red 50%,rgba(0,255,0,.7) 90%);
}
</style>
</head>
<body>
<div></div>
</body>
</html>
20
收起
正在回答
2回答
同学你好，思路如下：
本题就是利用background-image:linear-gradient();属性来实现渐变效果。其中，第一个参数代表方向，其他参数代表颜色划分：
90deg就代表从左往右渐变。
颜色分段如下：
由于页面默认颜色是白色，所以20%-50%设置成透明渐变为红色，也能满足练习中的效果。
祝学习愉快！
相似问题
登录后可查看更多问答，登录/注册
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星