今天你要和誰過？
今天你要怎么過？？
今天去哪里吃？？？
公司的三連問，對於一些單身狗有點招架不住啊。
在此送上一個薄禮，來安慰下受傷的心靈...
確定是安慰不是連環打擊嘛.....
回答：確定！
來吧**看效果圖上代碼：（靜態圖，實際是動態的）
HTML:
<div class="warp">
<div class="left"></div>
<div class="right"></div>
<div class="square"></div>
</div>
css:
.warp{
width: 500px;
height: 600px;
margin: 70px auto;
/*border:1px solid tomato;寫上這個便於確定定位的位置,最后在關掉*/
position: relative;
animation:heart 0.8s linear infinite ;/*動畫效果*/
transition:all 0.4s ease ;
}
.left{
width: 300px;
height: 300px;
border-radius:50%;
background-color: tomato;
display: inline-block;
}
.right{
width: 300px;
height: 300px;
border-radius:50%;
background-color: tomato;
position: absolute;
right:0;
top:0;
}
.square{
width: 300px;
height: 300px;
background-color: tomato;
position: absolute;
right:200px;
top:0px;
transform:translate(100px,100px) rotate(45deg);
}
@keyframes heart{
from{
transform: scale(1);
}
to{
transform: scale(1.2);
}
}
是連環打擊！（開下玩笑，表白❤技巧拿走了吧……）
歡迎大家提出寶貴意見，大神們請多多指教。