发新贴  快速回复

求助:移动端h5页面问题

w1080793
2015-11-06 17:57
各位大神,为什么移动端h5页面上 border 设置1px 的时候 为啥手机看是2px呢? 有遇到过这个问题的不?求帮忙。
ghostdp
由于高清屏的特性,1px是由2×2个像素点来渲染,border:1px在Retina屏下会渲染成2px的边框

可以试试transform:scaleY(0.5);

2015-11-08 16:59  回复本帖
多多
这个像素比有关,需要像素1:1还原的话可以动态设置像素比
2015-11-08 17:53  回复本帖
w1080793
 本帖最后由 w1080793 于 2015-11-9 10:31 编辑 

forum.php?mod=redirect&goto=findpost&pid=43701&ptid=14744
由于高清屏的特性,1px是由2×2个像素点来渲染,border:1px在Retina屏下会渲染成2px的边框

可以试试transf ...
老师 我试了下,border 是按照Y轴 缩了,变成1px 。   那么问题又来了  如果是 div   有border:solid 1px blue ;  用上 transform   整个div 都是 缩了0.5的。
  pc 端看的效果     移动端上面的效果



2015-11-09 10:07  回复本帖
w1080793
forum.php?mod=redirect&goto=findpost&pid=43703&ptid=14744
这个像素比有关,需要像素1:1还原的话可以动态设置像素比

<script type="text/javascript">
        window.err==htmlSize;
        window.err= =htmlSize;
        function htmlSize(){
            var cw=document.body.clientWidth;
            cw=cw/16;
            //计算倍数,数值可变。
            if(cw<20){cw=20} //最小宽度
            if(cw>30){cw=30} //最大宽度
            document.getElementById("body").style.fontSize=cw+'px';
            }
</script>


这个是我之前做项目用的 js   这样代码需要怎么改才能让border 2像素变成1px 呢 。老师。
2015-11-09 10:10  回复本帖
 
kongjiea
判断devicePixelRatio =2时 设置viewport为 <meta name="viewport" content="initial-scale=0.5, maximum-scale=0.5, minimum-scale=0.5, user-scalable=no">
2015-11-09 10:37  回复本帖
w1080793
forum.php?mod=redirect&goto=findpost&pid=43711&ptid=14744
判断devicePixelRatio =2时 设置viewport为

这样 页面整体会缩的是吗?
2015-11-09 11:44  回复本帖
ghostdp
forum.php?mod=redirect&goto=findpost&pid=43707&ptid=14744
老师 我试了下,border 是按照Y轴 缩了,变成1px 。   那么问题又来了  如果是 div   有border:solid 1px ...
外层div可以不用设置,通过伪类 :after(:before)设置其缩放比0.5

给你个地址:
http://www.cnblogs.com/wangshiyang/p/4824923.html

2015-11-09 12:32  回复本帖
w1080793
forum.php?mod=redirect&goto=findpost&pid=43720&ptid=14744
外层div可以不用设置,通过伪类 :after(:before)设置其缩放比0.5

给你个地址:


老师   左右两侧的边 该怎么写呢
2015-11-09 17:53  回复本帖
登录 后才可以发表回复