MJ系列之css汇总

权重

选择器

盒模型

1. W3C 标准盒模型：
   属性width,height只包含内容content，不包含border和padding。
2. IE 盒模型：
   属性width,height包含border和padding，指的是content+padding+border。

在当前W3C标准中盒模型是可以通过box-sizing自由的进行切换的。
content-box（标准盒模型）
width = 内容的宽度
height = 内容的高度
border-box（IE盒模型）
width = border + padding + 内容的宽度
height = border + padding + 内容的高度
当你想让两个子容器float:left，宽度各50%，然后给一点padding，最后让子容器并排充满父容器，一切想的挺美好，然而你发现结果并不是这么美好，因为子容器的盒子宽度已经超出了父容器的一半，导致了折行，于是，width就不能50%了，只能是50%再减去padding的像素值

响应式布局

同一页面在不同屏幕尺寸下有不同的布局。
响应式：只需要开发一套代码。 响应式设计通过检测视口分辨率，针对不同客户端在客户端做代码处理，来展现不同的布局和内容。
自适应：需要开发多套界面。 通过检测视口分辨率，来判断当前访问的设备是：pc端、平板、手机，从而