css样式踩坑总结

简介

本章内容主要总结css一些经验总结，不一定成熟或者在具体出现情况上描述不清，仅供参考

总结

1. rem单位产生的四舍五入

在一个项目中，通篇使用rem时，当需要精确到1px进行样式控制时，常常会产生1px的误差，比如某个1px的边框就被压住等等。
先放个rem的使用简介：http://www.jianshu.com/p/b00cd3506782
然后，产生的原因：http://web.jobbole.com/84113/
知道了原因，就需要针对具体情况，使用百分比替代，在不必要的地方直接使用px，避免过多的四舍五入。

2. 滚动条，overflow:auto

当需要滚动时，一个ul下几个li，li一定要设置高度或者行高，不然在某些机型上不能滚动。

3. 圆角边框颜色渐变

通过:after添加个渐变背景，漏出来1px作为边框。

4. 不要使用button标签

在一些机型上还是会产生样式差异，button似乎自带box-sizing:border-box，因为在将button标签修改为li时，需要加上这句话才能正常。

5. 1+3T手机上的问题

overflow:auto,两层div都有滚动时，结果内层滚动失效，将外层滚动的代码下降一个层级，结果可以了，不知道为啥。
还有一个问题，一层滚动，结果下滚没问题，不能上滚，但是快速划俩下以上时，有时触发向上滚动，最后添加了position:relative，解决，出现原因不清楚。。。。