弹性布局

文字流式，控件弹性，图片等比缩放

 

1.px相对显示器屏幕分辨率；

IE无法调整那些使用px作为单位的字体大小,在页面中按ctrl+滚轮，字体以px为单位的网站没有反应。px是绝对单位，不支持IE的缩放;

大部分的国产浏览器使用IE内核；

2.em相对父级元素字体尺寸；

 

3.rem(root em根em)

相对于html标签的font-size属性值来计算的

除了IE8及更早版本外，所有浏览器均已支持rem。对于不支持它的浏览器，应对方法也很简单，就是多写一个绝对单位的声明。这些浏览器会忽略用rem设定的字体大小。 

chorme54前版本默认汉字最小12px

 

弹性布局：相对于font-size设置元素宽度，以em为单位设置宽度，字号增加时布局随之扩大；

1.body{font-size:62.5%;}

2.将你的原来的px数值除以10，然后换上em作为单位；

设置基字号，让1em≈10px;大多浏览器默认字号16px;则em值变为 16px*62.5%=10px, 这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10，然后换上em作为单位就行了。

ie:1.2em会比12px稍大一些，解决办法是把html标签样式中的62.5%改成63%，即：html { font-size: 63%; }  

容器div{max-width:100%;}(<=ie6不支持，可用js),防止弹性布局变得比浏览器宽，导致水平滚动条出现；

p { text-indent: 2em; }　　段首空两格(如果用px作为单位，对12px字体来说需要空出24px)