H5页面的手机网站的声明,随着浏览设备自适应的声明。

H5页面的手机网站,随着浏览设备自适应的声明。

写如下声明:

解释:

width - viewport的宽度

height - viewport的高度

initial-scale - 初始的缩放比例

minimum-scale - 允许用户缩放到的最小比例

maximum-scale - 允许用户缩放到的最大比例

user-scalable - 用户是否可以手动缩放

精简点的话,可以把上面的代码更改为以下代码,效果是一样的:

viewport是网页默认的宽度和高度,上面这行代码的意思是,网页宽度默认等于屏幕宽度(width=device-width),原始缩放比例(initial-scale=1)为1.0,即网页初始大小占屏幕面积的100%。

最后就是不要设置太大的具体宽度属性了,比如你在网页把Body的宽度属性设为1000px,这肯定是不行的了,但是可以设置为90% 或者 auto,这是屏幕自适应的。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 原文地址 在移动设备上进行网页的重构或开发,首先得搞明白的就是移动设备上的viewport了,只有明白了viewp...
    matthewm阅读 5,412评论 0 4
  • (转自:http://blog.csdn.net/tengdazhang770960436/article/det...
    一个废人阅读 4,014评论 0 1
  • 讲真,“妈妈”真是一个自带设计天赋的族群~ 从懵懵懂懂认知水平仅停留在淘宝图片的爆款少女,进阶为一剪刀下去,气势分...
    蜘蜘纺阅读 1,443评论 0 0
  • 最近碰到一个超级严厉的师傅,于是想起了我这小半生里的严师们。 爹妈算是我一手接触的较严厉的人生导师。生我的时候他们...
    二麻子阅读 4,023评论 0 0
  • 昨天早起,摸不到公交卡,以为丢了。幸好晚上摸到在包里,那一瞬间的幸福感无以表达啊!允许我诗歌朗诵:啊,小卡,你咋又...
    nonoly阅读 1,618评论 3 0