## CSS 工具
**桌面 & 移动应用 CSS 框架:**
* [Semantic UI](http://semantic-ui.com/)
* [Foundation](http://foundation.zurb.com/)
* [Bootstrap](http://getbootstrap.com/)
* [Metro UI](http://metroui.org.ua/)
* [Pure.css](http://purecss.io/)
* [Concise](http://concisecss.com/)
* [Materialize](http://materializecss.com/)
* [Material Design Lite (MDL)](http://www.getmdl.io/index.html)
* [Base](http://getbase.org/)
**移动应用 CSS 框架:**
* [Ratchet](http://goratchet.com/)
**CSS 重置:**
> CSS 重置(或重置 CSS)是一个很小的, 被压缩的 CSS 规则集合, 用于重置所有 HTML 元素的样式. - [http://cssreset.com/](http://cssreset.com/)
* [Eric Meyer’s “Reset CSS” 2.0](http://meyerweb.com/eric/tools/css/reset/)
* [Normalize](https://necolas.github.io/normalize.css/)
**Transpiling:**
* [SASS/SCSS](http://sass-lang.com/)
* [stylus](https://github.com/stylus/stylus)
* [PostCSS](https://github.com/postcss/postcss) & [cssnext](http://cssnext.io/)
* [rework](https://github.com/reworkcss/rework) & [myth](http://www.myth.io/)
* [pleeease.io](http://pleeease.io/)
**参考文档:**
* [css3test.com](http://css3test.com/)
* [css4-selectors.com](http://css4-selectors.com/)
* [css3clickchart.com](http://css3clickchart.com/)
* [cssvalues.com](http://cssvalues.com/)
* [CSS TRIGGERS...A GAME OF LAYOUT, PAINT, AND COMPOSITE](http://csstriggers.com/)
* [MDN CSS reference](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference)
* [overapi.com CSS cheatsheet](http://overapi.com/css/)
**Linting/hinting:**
* [CSS Lint](http://csslint.net/)
* [stylelint](http://stylelint.io/)
**代码格式化/美化:**
* [CSScomb](https://github.com/csscomb/csscomb.js)
* [cssfmt](https://github.com/morishitter/cssfmt)
**优化:**
* [csso](http://css.github.io/csso/)
* [clear-css](https://github.com/jakubpawlowicz/clean-css)
* [cssnano](http://cssnano.co/)
**CSS 在线生成工具:**
* [Ultimate CSS Gradient Generator](http://www.kancloud.cn/FrontendMasters/front-end-handbook/blob/master/tools/Ultimate%20CSS%20Gradient%20Generator)
* [Enjoy CSS](http://enjoycss.com/)
* [CSS matic](http://www.cssmatic.com/)
* [patternify.com](http://patternify.com/)
* [patternizer.com](http://patternizer.com/)
* [CSS arrow please](http://cssarrowplease.com/)
* [flexplorer](http://bennettfeely.com/flexplorer/)
* [Flexbox Playground](https://scotch.io/demos/visual-guide-to-css3-flexbox-flexbox-playground)
**CSS 架构:**
* [oocss](http://oocss.org/) [read]
* [SMACSS](https://smacss.com/) [read][$]
* [Atomic Design](http://atomicdesign.bradfrost.com/) [read]
**编写规范:**
* [idiomatic-css](https://github.com/necolas/idiomatic-css) [read]
* [CSS code guide](http://codeguide.co/#css) [read]
* [cssguidelin.es](http://cssguidelin.es/) [read]
* [Google HTML/CSS Style Guide](http://google-styleguide.googlecode.com/svn/trunk/htmlcssguide.xml#General_Formatting)
**本月 CSS 仓库在Github的趋势:**
[https://github.com/trending?l=css&since=monthly](https://github.com/trending?l=css&since=monthly)
- Introduction
- 什么是前端开发者?
- 第一部分: 前端开发实践
- 前端的工作职称
- 常用的网络技术
- 前端开发技术栈
- 前端开发做什么
- 团队中的前端
- 全才神话
- 前端的面试问题
- 前端工作版块
- 前端薪资
- 如何培养前端开发者?
- 第二部分: 前端开发学习
- 自主学习
- Internet/Web
- Web浏览器
- DNS
- HTTP/网络
- Web 主机
- 前端开发综合学习
- 用户界面和交互设计
- HTML & CSS
- SEO
- Javascript
- Web 动画
- DOM, BOM & JQuery
- Web 字体
- 无障碍设计
- Web/浏览器 API
- JSON
- 静态网页生成器
- 前端应用架构设计
- 接口/API 设计
- Web 开发者工具
- 命令行
- Node.js
- 模块加载器
- 包管理器
- 版本控制
- 构建 & 任务自动化
- 网站性能优化
- JS 测试
- 无壳浏览器
- 离线开发
- 安全
- 多平台开发
- 指导学习
- 前端指导学习
- 前端开发者从哪里学
- 前端简报, 资讯 & 博客
- 第三部分: 前端开发工具
- 常用前端开发工具
- DOC/API 浏览
- SEO
- 原型和框架
- 图表
- HTTP/网络
- 代码编辑
- 浏览器
- HTML
- CSS
- DOM
- JavaScript
- 静态网页生成器
- APP(桌面, 移动, 平板等) 管理
- 脚手架
- 模板
- UI 部件 & 组件
- 数据可视化
- 图形
- 动画
- JSON
- 测试框架
- 数据存储
- 模块/包加载
- 模块/包仓库
- Web/云/静态主机托管
- 项目管理 & 代码托管
- 合作 & 交流
- CMS 托管/API
- BASS
- 离线
- 安全
- 任务管理
- 部署
- 网站/APP 监控
- JS 错误监控
- 性能