请老师检查谢谢
<!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>
/* body{
background: url('./img/a.png') no-repeat;
} */
.triangle1,.triangle1::before,.triangle1::after{
border:45px solid transparent;
border-top:33px solid yellow;
position: absolute;
width: 0;
height: 0;
transform: translate(44px,66px);
}
.triangle1::before,.triangle1::after{
content: '';
display: block;
}
.triangle1::before {
transform: translate(-63px,-39px) rotate(70deg);
transform-origin: 50px 33px;
}
.triangle1::after {
transform: translate(-29px,-49px) rotate(-71deg);
transform-origin: 50px 33px;
}
.content{
width: 450px;
height: 300px;
background-color: red;
}
.triangle1:first-child{
transform: translate(35px,64px);
}
.triangle1:nth-child(2){
transform: translate(108px) scale(0.3) rotate(23deg);
}
.triangle1:nth-child(3){
transform: translate(138px,29px) scale(0.3) rotate(47deg);
}
.triangle1:nth-child(4){
transform: translate(143px,76px) scale(0.3);
}
.triangle1:nth-child(5){
transform: translate(108px,107px) scale(0.3) rotate(21deg);
}
</style>
</head>
<body>
<div class="content">
<div class="triangle1"></div>
<div class="triangle1"></div>
<div class="triangle1"></div>
<div class="triangle1"></div>
<div class="triangle1"></div>
</div>
</body>
</html>12
收起


恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星