关于页⾯缩放时css错乱的处理⽅法---之⼀
这⼏天遇到⼀个问题，就是在做⽹页的时候，页⾯缩放时，布局就乱了，原来的样⼦不会跟随缩放的放⼤或者缩⼩进⾏改变，直接导致的后果，就是页⾯很难看，⽆法使⽤
box sizing之前虽然写了代码，但是⼀直没有注意到缩放后页⾯的效果会改变的事情，这⼏天还是别⼈发现了，来告诉我有这种问题，我才知道，感觉有点失败啊；关键的问题是，即使知道了问题，还不知道怎么处理，这才是最⼤的问题；
现象如下：
缩放后，有⼀部风图标的位置就不够了，被挤了下来
css 如下：使⽤元素的固定宽度
1    position: relative;
2    float: left;
3    width: 118px;
4    height: 124px;
5    border: 1px solid #eeeeee;
想了很久，都没有想到，还是与朋友聊天的时候，才到解决⽅法：如下：设置成包含边框的元素，按照百分⽐来布局
1    position: relative;
2    float: left;
3    width: 10%;
4    height: 124px;
5    border: 1px solid #eeeeee;
6    box-sizing: border-box;
7    -moz-box-sizing: border-box;
8    -webkit-box-sizing: border-box;
9    -o-box-sizing: border-box;
10    -ms-box-sizing: border-box;
缩放也不会变化了，搞定.....

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。