![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css动画特效
文章平均质量分 56
mr3x
专注于js,python,c++3门编程语言
展开
-
[001]-css实现抽象眼睛
效果预览https://codepen.io/strugglingBoy/pen/rqejqR代码下载https://github.com/enstrongbill/daily-frontend-exercise/tree/master/021-abstract-eyes代码解读定义一个.eye的容器,里面包含9个.cirque(圆环)<div class="eye">...原创 2018-10-04 12:39:49 · 324 阅读 · 0 评论 -
[002]-css实现颜文字动画
效果预览https://codepen.io/strugglingBoy/pen/BqKWBY代码下载https://github.com/enstrongbill/daily-frontend-exercise/tree/master/020-shrug代码解读1.html代码:定义一个.shrug容器<div class="shrug"> <...原创 2018-10-04 13:56:54 · 710 阅读 · 0 评论 -
[003]-css实现啊飘
效果预览https://codepen.io/strugglingBoy/pen/ReRjqr代码下载https://github.com/enstrongbill/daily-frontend-exercise/tree/master/022-ghost代码解读啊飘是通过两个上半园和下半园合在一起形成的,眼睛和嘴巴是通过伪元素所形成的1.html代码定义了一个.ghost的容...原创 2018-10-05 20:01:49 · 211 阅读 · 0 评论 -
[007]-css实现变形虫
效果预览https://codepen.io/strugglingBoy/pen/EdLReY代码下载https://github.com/enstrongbill/daily-frontend-exercise/tree/master/029-amoeba代码解读主要利用border-radius来实现变形虫外观的变化,背景的变化就使用background-position来实现1...原创 2018-10-19 20:24:28 · 321 阅读 · 0 评论 -
[004]-css实现蝙蝠侠
效果预览https://codepen.io/strugglingBoy/pen/jeGJxZ代码下载https://github.com/enstrongbill/daily-frontend-exercise/tree/master/027-batman代码解读蝙蝠侠是通过一个圆形和四个三角形所形成的1.html代码定义了一个.batman的容器(用于画出蝙蝠侠的脸),两个...原创 2018-10-17 17:31:47 · 204 阅读 · 0 评论 -
[005]-css实现热气球
效果预览https://codepen.io/strugglingBoy/pen/VEzEqJ代码下载https://github.com/enstrongbill/daily-frontend-exercise/tree/master/025-hot-air-balloon代码解读热气球由热气袋和篮子所组成,.envelope里面的第一个span标签是热气袋的制作,热气袋是由一个圆...原创 2018-10-17 18:12:26 · 817 阅读 · 0 评论