0 0 756

我嘴里边嚼的是大大泡泡糖,我心里面想的是日本花姑娘。现在用代码就可以实现了。 小人和泡泡均由块div和css组成,吹泡泡和走路特效也是css3的动画完成。背景颜色也是由css3完成。js就是控制了背景音乐的播放。css3强大呀。

css3+svg实现潇洒的你迈着优雅的步伐嘴里吹着大大泡泡糖_图一

介绍下核心css

.face__bubble {
    position: absolute;
    left: 2.5vw;
    bottom: 0;
    width: 0;
    height: 0;
    border-radius: 50% 50% 50% 50%/100% 50% 50% 0;
    background-color: var(--green);
    animation: bubble ease-in-out 5000ms infinite;
    z-index: 100;
    mix-blend-mode: difference;
}
/*这段css 就是吹泡泡的过程*/

你能想到这是描写耳朵的css一部份吗

.ear-l, .ear-r {
    position: absolute;
    width: 1.75vw;
    height: 1.75vw;
    background-color: var(--white);
    border-top-left-radius: 1vw;
    border-bottom-left-radius: 1vw;
    border-bottom-right-radius: 1vw;
    animation: ear-l ease-in-out 300ms infinite alternate;
}
下载所需: 5金币 下载 演示
[分类]
[来源] http://erlangyun.com/p/id/201.html
[声明] 本站资源来自用户分享,如损害你的权益请联系客服QQ:120074275给予处理。