px： 绝对单位， 给多少就是多少； 问题：不管屏幕尺寸怎么变化，它都不会变，做不到适配。
em： 相对单位，相对于自身字体大小的值；font-size：12px，1em=12px。 问题：①chrome下有最小字体限制，必须为12px，所以这个值不能小于12； ②如果两个一样的元素，但是里面字体不一样，那就不能统一设置了。或者元素字体变化了，就又要统一设置一遍。
rem： CSS3新增的一个相对单位，相对于根节点（html）字体大小的值。html{font-size:12px;} 1rem=12px；默认情况下是16px。通过它就可以做到只修改根元素的大小，就能成比例地调整所有字体的大小。
移动端问题
body下的overflow问题： body加了overflow：hidden；后横向没效果（IOS下，Andriod下没问题）
固定定位问题： ①固定定位在移动端的兼容性很不好，在以前老版本的安卓手机不支持，ios4以前的版本也不支持。② QQ浏览器下有时候往上滑动的话，就会隐藏掉header；③当打开键盘的时候，固定定位就是去作用了。
样式重置问题：①链接点击的时候默认有一个背景 -webkit-tap-highlight-color：rgba(0,0,0,0); ②按钮在ios下都是圆角 -webkit-apperance:none; //清除输入框和按钮的默认外观；border-radius:0; ③每台设备里的默认字体是不一样的（移动端设备里大部分没有宋体与微软雅黑字体）font-family: helvetia; ④切换横竖屏或者用户自己通过浏览器设置的话，可以改变字体的大小（需要给body下的所有元素）-webkit-text-size-adjust:100%; ⑤长按文字ios下会选中文字，安卓无效；-webkit-user-select:none; ⑥固定定位在一些ios低版本中不兼容，以及一些国产手机里也不兼容。
网友评论