麻烦老师检查，谢谢。
来源：2-8 编程练习
qq_慕移动3101913
2019-08-12 15:51:08
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>2-3</title>
<style type="text/css">
/* 此处写代码*/
.content{width:600px;height:400px;background:red;margin:0 auto;position: relative;}
.share{
border-top: 30px solid yellow;
width: 0;
height: 0;
border-top: 50px solid yellow;
border-right: 90px solid transparent;
border-left: 90px solid transparent;
position: absolute;
top:100px;
left:51px;
transform: scale(0.8,0.8);
}
.share::before,
.share::after{
content: "";
display: block;
position: absolute;
border-top: 50px solid yellow;
width: 0;
height: 0;
border-right: 90px solid transparent;
border-left: 90px solid transparent;
}
.share::before{top:-43px;left: -89px;transform: rotate(71deg);}
.share::after{top:-47px;left: -96px;transform: rotate(147deg);}
.two{transform: rotate(5deg) scale(.25);left: 143px;top: 15px;}
.three{transform: rotate(-27deg) scale(.25);left: 211px;top: 48px;}
.four{transform: rotate(10deg) scale(.25);left: 215px;top: 129px;}
.five{transform: rotate(18deg) scale(.25);left: 143px;top: 185px;}
</style>
</head>
<body>
<!-- 此处写代码 -->
<div class="content">
<div class="one share"></div>
<div class="two share"></div>
<div class="three share"></div>
<div class="four share"></div>
<div class="five share"></div>
</div>
</body>
</html>
1回答
-
好帮手慕糖
2019-08-12
同学你好，效果实现是可以的哦，继续加油！
祝学习愉快！
0
相似问题