{

margin: 0px;

padding: 0px;

}

body,html{

height: 100%;

}

.content{

position: relative;/*(相對(duì)定位)*/

height: 100%;

background: #f2f2f2;

}

.yudi{

position: absolute;/*(絕對(duì)定位)*/

width: 4px;

height: 6px;

background: #ccc;

/*(剪切路徑)*/clip-path: ellipse(10% 30% at 50% 50%);/*(橢圓形)*/

/*(變換)*/transform: scale(6);/*(縮放)*/

/*(動(dòng)畫)*//*(下降)*/animation: drops 1s ease-in infinite/*(無(wú)限)*/;

}

@keyframes drops{

0%{

opacity: 0;/*(不透明)*/

}

20%{

opacity: 1;

}

90%{

opacity: 1;

}

100%{

opacity: 0;

transform: translate3d(10px,100%,-10px);

}

}