-
包含 CSS、JS特效插件 的工具集，快速开发网页
-
经典的UI框架： BootStrap、JQueryUI、MeiziUI......
2 BootStrap
2.1 版本
-
用于生产环境 (CSSJavaScript)
-
源码(LESS) (LESS是CSS预处理器)
-
SASS （SASS也是CSS预处理）
3 响应式布局
3.1 手机屏幕的分辨率
-
现在绝大部分 手机 视网膜屏幕， 有物理分辨率，和 渲染分辨率。 iphone8
750*1334渲染分辨率：375*667 -
手机浏览器 为了让 没有做响应式处理的网页能够正常显示， 自动进行缩放。视口的大小通常会设置为 980px
3.2 媒体查询
@media (min-) {
选择器 {
}
选择器 {
}
}
媒体特效：
min-width
min-height
max-width
max-height
width
height
.........
3.3 视口
<meta name="viewport" content="width=device-width,initial-scale=1.0">
自适应窗口大小，不缩放，默认是缩放的
meta:vp 快捷键
4 布局
4.1 栅格系统
.container
<768px 100% 超小屏幕 xs
>=768px <992px 750px 小屏幕 sm
>=992px < 1200px 970px 中等屏幕 md
>=1200px 1170px 大屏幕 lg
行和列
行 .row
列 col-xs-* col-sm-* col-md-* col-lg-*
把父元素分成12份，指定几份
4.2 表格
.table
.table-striped
.table-bordered
.table-hover
.table-condensed
.success .info .danger .warning .active
4.3 表单
.form-horizontal
.from-group
.form-control
.control-label
4.4 其他
5 组件
6 插件