2015年度 CodePen Top 100 代码片段_html/css_WEB-ITnose
程序员文章站
2022-06-03 22:04:20
...
代码笔（CodePen）有很多出众的前代码片段，设计师或喜欢前端的人员可以都可能常去那边寻找灵感或学习一些代码的运用。最近CodePen放出2015年度最热门的100个代码片段，很多代码确实很赞，大家不要错过哦，下面我们筛选几个给大家欣赏。
截图画自 Top18
注：以下代码内容以iframe形式嵌入，RSS订阅用户可能无法正常查看真实效果，请到设计达人网站查看。
加载稍慢，想看好东西，请耐心等待。
Top 1: Chill the lion
很可爱的筛子，按住鼠标左键风车会转动哦。
Top 2: pen#PwLXXP
用代码写的一个教学视频教程，一边code，一边绘制一个心形图案。
Top 3: #DaftPunKonsole
一个小游戏，但没研究出怎么玩？连成一个句子吗？
Top 4: Elastic SVG Sidebar Material Design
一个SVG侧边栏，那个弹性动画很NICE.
Top 5: 10 stylish hover effects with less
10个文字HOVER特效，那个像游览一样的效果场景很适当。
Top 6: Gooey Menu
菜单效果
Top 7: ·● MOTION for the web ●·
文字动画，字好看，动画也好看。
Top 8: 10 stunning hover effects with scss
10个文字应用特效
Top 9: Bubble • Layout
Top 10: Flipside
这个弹窗的交互很赞呢。
小编觉得TOP10并不是最好的，在其它代码片段中也有很多惊艳或者实用的案例，请前往Codepen网站查看。
网站名称：The most hearted of 2015
网站地址： http://codepen.io/2015/popular/pens/
你也可以查看2014年的TOP100代码：「 2014年Codepen上最热门的100个code&CSS片段代码 」
交流：想结交更多有才华的设计师？请到（UI设计QQ群）列表，与50000名设计师交流设计。
设计导航：小盆友和大神都值得拥有的设计师网址导航： http://hao.shejidaren.com