css一些简单特效
2020-06-02 本文已影响0人
鱼香肉丝没有渔
image.png
<style>
.a {
border: 250px solid yellow;
width: 0;
height: 0px;
border-top: none;
border-left-color: transparent;
border-right-color: transparent;
}
</style>
<body>
<div class="a"></div>
</body>
image.png
<style>
.a {
width: 50px;
height: 50px;
background-color: orange;
border-radius: 50%;
}
.a1 {
position: relative;
}
.b1 {
position: absolute;
animation: 2s ease-in-out apple infinite;
}
@keyframes apple {
0% {
opacity: 1;
transform: scale(1);
}
100% {
opacity: 0;
transform: scale(1.5);
}
}
</style>
<body>
<div class="a a1">
<div class="a b1"></div>
</div>
</body>
