开发者社区> 问答> 正文

svg在“container-fluid”中定位,iphone4-5-6出现莫名显示差异

在html文件开头加了这样的代码,根据屏幕宽度设置svg的缩放(svg本身定义的width=316,而container-fluid左右padding都是15,所以给屏幕宽度减去30)

<style id="style"></style>
<script>
    var phoneScale = (parseInt(window.screen.width-30))/316;
    document.getElementById('style').innerHTML='svg{transform: scale('+phoneScale+',1);margin-left:0px;}';
</script>

在iphone6中,svg元素(左)和父元素.container-fluid(右)分别是这样的:
screenshot

展开
收起
a123456678 2016-05-27 14:25:11 2070 0
1 条回答
写回答
取消 提交回答
  • 这个是缩放基准点的问题,需要定义如下样式:

    svg{
      -webkit-transform-origin: 0 0 0;
      -moz-transform-origin: 0 0 0;
      -ms-transform-origin: 0 0 0;
      -o-transform-origin: 0 0 0;
      transform-origin: 0 0 0;;
    }
    2019-07-17 19:17:48
    赞同 展开评论 打赏
问答地址:
问答排行榜
最热
最新

相关电子书

更多
APP加固新方向 --混淆和瘦身 立即下载
UI2CODE智能生成flutter代码--整体架构 【上叶】 立即下载
APP加固新方向-混淆和瘦身 立即下载