手机前端页面尺寸
导读:本文共2059.5字符,通常情况下阅读需要7分钟。同时您也可以点击右侧朗读,来听本文内容。按键盘←(左) →(右) 方向键可以翻页。
摘要:iPhone4/iPhone4s 320 372 / 320 441 (已隐藏URL与状态栏)iPhone5/iPhone5s 320 460 / 320 529 (已隐藏URL与状态栏)Note2 360 567 (未隐藏URL与状态栏)iPad 3/4 768928 (未隐藏URL与状态栏)GALAXY SIII 360 567 (未隐藏URL与状态栏)米... ...
目录
(为您整理了一些要点),点击可以直达。iPhone4/iPhone4s 320 372 / 320 441 (已隐藏URL与状态栏)iPhone5/iPhone5s 320 460 / 320 529 (已隐藏URL与状态栏)Note2 360 567 (未隐藏URL与状态栏)iPad 3/4 768928 (未隐藏URL与状态栏)GALAXY SIII 360 567 (未隐藏URL与状态栏)米2A 360 567 (未隐藏URL与状态栏)HTC G10 320 * 460<meta name="viewport"网页手机wap2.0网页head加入面条元标签iPhone浏览器页面原始显示并允许缩放 <meta name="viewport"content="width=device-width, initial-scale=1.0, minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"> width - viewport宽度 height -viewport高度 initial-scale - 初始缩放比例 minimum-scale -允许用户缩放比例 maximum-scale -允许用户缩放比例 user-scalable - 用户否手缩放参考:http://webdesign.tutsplus.com/tutorials/htmlcss-tutorials/quick-tip-dont-forget-the-viewport-meta-tag/、网页手机wap2.0网页head加入面条元标签iPhone浏览器页面原始显示并允许缩放<meta name="viewport"content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">其: width - viewport宽度 height - viewport高度 initial-scale -初始缩放比例minimum-scale - 允许用户缩放比例 maximum-scale - 允许用户缩放比例user-scalable -用户否手缩放c二、关于meta详细介绍请参考三、文关于Meta例详细介绍 原文址3. Meta元素视区 默认情况iPhoneSafari象屏幕桌面浏览器显示页面宽度达980像素缩内容适应iPhone屏幕用户iPhone看页面觉字体比较比较模糊必须要放才能看真切于普通Web页面似乎接受于用应用程序没几能够受 幸运使用特殊Meta元素视区进行纠:<metaname="viewport" content="width=device-width"/> 元素通知浏览器使用设备宽度作视区宽度默认980像素我看看两同例 例3(链接:http://www.sitepoint.com/examples/iphone-development-12tips/no-viewport.html)显示简单段落元素没Meta元素视区字体点模糊iPhone运行实际情况图所示图 1 视区显示效 例4(链接:http://www.sitepoint.com/examples/iphone-development-12tips/viewport.html)包括视区元素现设备宽度320像素字体比前例更清晰iPhone运行实际情况图所示图 2 视区显示效 另外手设置device-width值例假设博客页面宽度750像素桌面屏幕佳800x600像素例5(链接:http://www.sitepoint.com/examples/iphone-development-12tips/fixed750.html)显示删减版本iPhone浏览看980像素剩空间都填充白色 消除额外空间使用meta元素视区宽度设780像素:<metaname="viewport" content="width=780"/> 例6(链接:http://www.sitepoint.com/examples/iphone-development-12tips/fixed750-viewport.html)显示meta元素视区布局固定效 Meta元素视区内容包括逗号隔值initial-scale –用户初看页面放级别于Web应用程序见设置:<metaname="viewport" content="width=device-width,initial-scale=1,user-scalable=no"/> 元素设置宽度设备宽度禁止用户放缩
手机前端页面尺寸的详细内容,希望对您有所帮助,信息来源于网络。