在上一篇文章介绍了几个CSS框架,这次要介绍一些让你的项目变得有趣的库和工具。这些工具用起来都很简单,所以就不具体说用法了,感兴趣的话可以点进链接去了解。
一、动态效果
Animate.css
https://daneden.github.io/animate.css/Animate.css是比较流行的动画效果库,提供了大量的动画效果,你可以点进链接尝试一下。AniJS
AniJS和Animate.css一样,也提供了很多的动画效果,体验页面很方便。Hover.css
http://ianlunn.github.io/Hover/
CSShake
https://elrumordelaluz.github.io/csshake/
Hakim.se
这是Reveal.js的作者Hakim El Hattab的个人网站,上面有很多交互和CSS动画的demo,项目大多是开源的。
Typed.js
http://www.mattboldt.com/demos/typed-js/
在你的页面上添加一个打字机效果。虽然用js很容易实现,但这个要更完善,有更多的自定义选项。
二、创意
404页面
https://www.zhihu.com/question/20124207/answer/129172255
为你的项目添加一个有趣的404页面也是很重要的,我在这个回答里整理了20多个有意思的404页面,希望能给你带来启发。
三、工具
Instafavicon
项目要展示了,少不了一个favicon。这个网站可以帮你快速生成一个简洁美观的站点图标。
favico.js
http://lab.ejci.net/favico.js/
有了favicon后,使用favico.js你还可以给它加上一些动态效果,比如像图片里那样添加一个显示消息数量的badge,或是添加一个静音图标。
Github Page Generator
https://help.github.com/articles/creating-pages-with-the-automatic-generator/
Github提供了很多主题可供选择:
四、挂件
Github Ribbon
https://github.com/blog/273-github-ribbons
Flask Badge
http://flask.pocoo.org/community/badges/
Flask提供了很多badge,你可以把它放到你的网页的footer里。
- - - - -
更多关于Flask和Web开发的优质原创内容,欢迎关注Hello, Flask! - 知乎专栏。