码迷,mamicode.com
首页 > Web开发 > 详细

使用<meta>设置响应式

时间:2020-04-15 18:10:14      阅读:161      评论:0      收藏:0      [点我收藏+]

标签:device   init   max   配置   最大   use   网页   height   color   

  • 通过<meta>配置vieport,实现响应式布局
  • 也是移动端的通用适配方案
    • 网页宽度与PC端一致
    • 网页缩放比例与PC端一致
    • 不允许用户自行缩放

viewport

  • 由浏览器承载
  • 套在网页的外层,但是是隐藏的
  • 当把网页放在移动端进行显示时,viewport会把网页进行等比例缩放,适应移动端的设备大小

配置详情

  • width:设置宽度
  • height:设置高度
  • initial-scale:设置默认缩放比例
  • user-scalable:设置是否允许用户自行缩放页面
  • maximum-scale:设置最大缩放比例
  • minimum-scale:设置最小缩放比例

<meta>实现

<meta name=‘viewport‘ content = ‘width=device-width, initial-scale=1.0, userscalable:no‘ >

 

使用<meta>设置响应式

标签:device   init   max   配置   最大   use   网页   height   color   

原文地址:https://www.cnblogs.com/ashen1999/p/12706776.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!