每日一题 《viewport 了解》

399 阅读1分钟
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimu
// width 设置viewport宽度,为⼀个正整数,或字符串‘device-width’
// device-width 设备宽度
// height 设置viewport⾼度,⼀般设置了宽度,会⾃动解析出⾼度,可以不⽤设置
// initial-scale 默认缩放⽐例(初始缩放⽐例),为⼀个数字,可以带⼩数
// minimum-scale 允许⽤户最⼩缩放⽐例,为⼀个数字,可以带⼩数
// maximum-scale 允许⽤户最⼤缩放⽐例,为⼀个数字,可以带⼩数
// user-scalable 是否允许⼿动缩放

移动端 1px 被 渲染成 2px 问题

1、局部处理

mate 标签中的 viewport 属性 , initial-scale 设置为 1

rem 按照设计稿标准⾛,外加利⽤ transfrome 的 scale(0.5) 缩⼩⼀倍即可;

2、全局处理

mate 标签中的 viewport 属性 , initial-scale 设置为 0.5

rem 按照设计稿标准⾛即可