[html] view plain copy
<meta name="viewport" content="width=device-width, initial-scale=10, minimum-scale=05, maximum-scale=20, user-scalable=yes" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="format-detection" content="telephone=no" />
第一行：
width=device-width ：表示宽度是设备屏幕的宽度
initial-scale=10：表示初始的缩放比例
minimum-scale=05：表示最小的缩放比例
maximum-scale=20：表示最大的缩放比例
user-scalable=yes：表示用户是否可以调整缩放比例
第二行：
设定iphone端页面全屏。
第三行：
取消数字被识别为电话号码。
如果是想要一打开网页，则自动以原始比例显示，并且不允许用户修改的话，则是：
[html] view plain copy
<meta name="viewport" content="width=device-width, initial-scale=10, minimum-scale=10, maximum-scale=10, user-scalable=no" />
这样子写后，就可以把一些页头横幅等的的宽度都设置成style="width:100%"，整个页面在设备上看起来就是全屏的了。很高兴帮到你
你说的这个是网页的自适应
我刚修改完我的网站，强烈不建议购买现成的自适应网站或者使用转码工具，很垃圾。
如果你有技术，会修改JS和css，请按照以下步骤 *** 作：
首先在js里面添加判断语句，主要功能为判断浏览器为移动端时加载某个css，例如123css，加载路径一定要注意，不要写错了，路径请使用绝对路径。
其次，编辑123css，宽度使用百分比，字体大小也是用em而不是固定值px，编辑过程中需要删除一些不必要的版块，也就是说并不是电脑上显示的手机上就都得显示。
最后，导航栏使用点击下啦的方式，不点击自动收回。一定要考虑不同分辨率下的显示情况，这个很关键，必要时可使用不同分辨率缩放功能（需要js和css配合）
这个修改的过程非常麻烦，需要很大的耐心。
制作一个手机web前端：
工具：智能手机，普通智能手机：320×480竖版。
节省样式的加载
目前而言，要改变网站的配色方案或者写iPad专用的样式表，是通过如下代码：
可以通过下面这个方法去加载指定分辨率下的样式，当使用相应的设备，才能加载到相应的样式表。
meta标签,即CSS媒体查询
强制让文档的宽度与设备的宽度保持1:1；
文档初始化缩放比例是1:1；
不允许用户点击屏幕放大浏览；
允许用户缩放到的最大比例尤其要注意的是content里多个属性的设置一定要用分号空格来隔开，如果不规范将不会起作用。
CSS3-webkit相关的HTML5标记元素的使用功能
消除被点击元素的外观变化，所谓的点击后高亮。
阻止旋转屏幕时自动调整字体大小。
解决字体在移动端比例缩小后出现锯齿的问题。
appearance属性使元素看上去像标准的用户界面元素。
鼠标可以悬停在内容上（指向该内容）而不激活它（单击它）。
使用自适应模式布局
safari都能够正常的显示网页内容（也就是自适应），而且自适应之后也不用考虑分辨率的问题。
javascript库
有很多设备的“”都大于15或者等于2（window=物理像素/dips）。移动端webapp上CSS要为Retian屏幕准备另外的及代码。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）