Bootstarp和常用的前端库

• Bootstrap
• Neat.css
• Reset.css
• Normalize.css

Normalize.css

Normalize.css 是一个可定制的 CSS 文件，使浏览器呈现的所有元素，更一致和符合现代标准。它正是针对只需要统一的元素样式。该项目依赖于研究浏览器默认元素风格之间的差异，精确定位需要重置的样式。这是一个现代的，HTML5-ready 的 CSS 重置样式集。
http://www.yyyweb.com/demo/inner-show/normalize.html
http://www.cnblogs.com/joyeecheung/p/3941475.html

Reset.css

在HTML标签在浏览器里有默认的样式，例如 p 标签有上下边距，strong标签有字体加粗样式，em标签有字体倾斜样式。不同浏览器的默认样式之间也会有差别，例如ul默认带有缩进的样式，在IE下，它的缩进是通过margin实现的，而Firefox下，它的缩进是由padding实现的。在切换页面的时候，浏览器的默认样式往往会给我们带来麻烦，影响开发效率。所以解决的方法就是一开始就将浏览器的默认样式全部去掉，更准确说就是通过重新定义标签样式。“覆盖”浏览器的CSS默认属性。最最简单的说法就是把浏览器提供的默认样式覆盖掉！这就是CSS reset。
浏览器的品种很多，每个浏览器的默认样式也是不同的，比如标签，在IE浏览器、Firefox浏览器以及Safari浏览器中的样式都是不同的，所以，通过重置button标签的CSS属性，然后再将它统一定义，就可以产生相同的显示效果。
http://meyerweb.com/eric/tools/css/reset/

Neat.css

Cube是由阿里妈妈团队创建。取自电影 《Cube》。电影里的 Cube 是个构造错综复杂的立方体，取这个名字，则是希望此项目能回归立方体的本意，和电影的愿景， 即项目应简单，一横一竖，自成一体。
官网地址：http://thx.github.io/cube/
github：https://github.com/thx/cube

包含模块
Neat：全新的样式重置
Layout：更加丰富的布局
Iconfont：海量图标字体
Button：自适应按钮
Type：照顾中文的版式设计

使用方法

```

下载
最新 CDN 地址：
[cube.css](http://g.tbcdn.cn/thx/cube/1.2.1/cube.css)http://g.tbcdn.cn/thx/cube/1.2.1/cube.css

[cube.css 压缩版](http://g.tbcdn.cn/thx/cube/1.2.1/cube-min.css)http://g.tbcdn.cn/thx/cube/1.2.1/cube-min.css

选择与折衷
需要注意的是 cube.css 中将包含：
[neat.css](http://thx.github.io/cube/doc/neat)
[iconfont.css](http://thx.github.io/cube/doc/iconfont)
layout.css
utils.css
button.css

但**不包含** [type.css](http://www.w3cways.com/cube/doc/type)。因此在需要版式设计的网站，例如个人博客中，推荐一次加载 cube.css 与 type.css：

```

模块演示
utils(工具类) | type(照顾中文的版式设计) | layout(更加丰富的布局) | button(自适应按钮)

Bootstrap

http://www.bootcss.com/
一款强大的框架式布局

默认

默认样式

Legend

Label name Example block-level help text here. Check me out Submit

搜索样式

Search

行内表单

Remember me Sign in

水平表单

Email

Password

Remember me Sign in

输入框

文本域

复选框和单选框

Option one is this and that—be sure to include why it's great Option one is this and that—be sure to include why it's great Option two can be something else and selecting it will deselect option one

行内复选框

1 2 3

下拉框

1 2 3 4 5 1 2 3 4 5

bootstrap.gif

Semantic UI

• 用户界面是网站的语言
• 同Bootstrap网站 一款强大的前端开发框架 跟Bootstrap死磕到底
  http://www.semantic-ui.cn/