老师，这是第二种写法，可以这样写吗？有需要改进的部分吗？
来源：2-28 项目作业
临溪倚山靠
2021-10-12 20:32:42
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.box1 {
width: 400px;
height: 200px;
overflow: hidden;
}
.box2 {
width: 400px;
height: 400px;
background-image: radial-gradient(50% 50%,white 40%,orangered 50%,yellow 60%,greenyellow 70%,blueviolet 80%,purple 90%);
border-radius: 50%;
}
</style>
</head>
<body>
<div class="box1">
<div class="box2"></div>
</div>
</body>
</html>
1回答
-
同学你好，这样写是可以的。可以改进一下，比如让每一块的颜色不是渐变形式的：
background-image: radial-gradient(50% 50%,white 40%, orangered 40%,orangered 50%,yellow 50%,yellow 60%,greenyellow 60%,greenyellow 70%,blueviolet 70%,blueviolet 100%);
祝学习愉快！
0
相似问题