首页 >

viewport在移动设备上的兼容性介绍

web前端|html教程viewport在移动设备上的兼容性介绍
兼容性++浏览器,viewport,兼容性
web前端-html教程
安卓基于bmob源码,ubuntu编辑ip,安装tomcat全过程,科学爬虫实验,php微信自动回复源码,武汉便宜的seo推广怎么做lzw
移动设备上的viewport分为layout viewportvisual viewport ideal viewport 三类,
其中的ideal viewport是最适合移动设备的viewport,ideal viewport的宽度等于移动设备的屏幕宽度,只要在css中把某一元素的宽度设为ideal viewport的宽度(单位用px),那么这个元素的宽度就是设备屏幕的宽度了,也就是宽度为100%的效果。
ideal viewport 的意义在于,无论在何种分辨率的屏幕下,那些针对ideal viewport 而设计的网站,不需要用户手动缩放,也不需要出现横向滚动条,都可以完美的呈现给用户。
因为所有的iphone的理想viewport宽度都是320px,所以让H5页面适应所有的iphone手机以及安卓机型的简单粗暴的方法是:设置viewport
meta viewport 标签首先是由苹果公司在其safari浏览器中引入的,目的就是解决移动设备的viewport问题。后来安卓以及各大浏览器厂商也都纷纷效仿,引入对meta viewport的支持,事实也证明这个东西还是非常有用的。在苹果的规范中,meta viewport 有6个属性(暂且把content中的那些东西称为一个个属性和值),如下:
width设置layout viewport 的宽度,为一个正整数,或字符串”width-device”
initial-scale设置页面的初始缩放值,为一个数字,可以带小数
minimum-scale允许用户的最小缩放值,为一个数字,可以带小数
maximum-scale允许用户的最大缩放值,为一个数字,可以带小数
height设置layout viewport 的高度,这个属性对我们并不重要,很少使用
user-scalable是否允许用户进行缩放,值为”no”或”yes”, no 代表不允许,yes代表允许
这些属性可以同时使用,也可以单独使用或混合使用,多个属性同时使用时用逗号隔开就行了。
淘客分享源码,ubuntu挂机软件下载,tomcat启动一直出错,python爬虫取值,php远程连接pdo sver,seo模板原创lzw

viewport在移动设备上的兼容性介绍
  • HTML5中的progress元素的详细介绍及兼容性处理
  • HTML5中的progress元素的详细介绍及兼容性处理 | HTML5中的progress元素的详细介绍及兼容性处理 ...

    viewport在移动设备上的兼容性介绍
  • css display inline block 兼容性问题写法
  • css display inline block 兼容性问题写法 | css display inline block 兼容性问题写法 ...

    viewport在移动设备上的兼容性介绍
  • meta viewport标签的使用说明(手机浏览缩放控制)【HTML】
  • meta viewport标签的使用说明(手机浏览缩放控制)【HTML】 | meta viewport标签的使用说明(手机浏览缩放控制)【HTML】 ...