首先你要在html页面头部加上下面的代码，其次你要把页面中的宽度修改为百分比，不能不用固定尺寸，一些小的模块可以用固定尺寸再就是css中要应用到媒体查询，也就是@media，不懂可以百度ltmeta name=quotviewportquot content=quotwidth=devicewidth， initialscale=1quot。

这篇文章主要介绍了HTML5 移动页面自适应手机屏幕四类方法总结，非常具有实用价值，需要的朋友可以参考下1使用meta标签viewportH5移动端页面自适应普遍使用的方法，理论上讲使用这个标签是可以适应所有尺寸的屏幕的，但是各设备对该标签的解释方式及支持程度不同造成了不能兼容所有浏览器或系统 viewport。

1CSS 方面去掉所有元素的外间距内边距，html 和 body 宽高设为 100%，canvas 元素 display 设为 block2JS 方面监听窗口的 resize 事件，在窗口大小改变的同时调整 canvas 的大小3完整代码这里我们使用 jQuery 来处理窗口尺寸改变事件响应，以及属性设置4同时使用 $windowget0。

ltstyle type=quottextcssquot html fontsize 42px ltstyle4 按照设计图的像素进行开发 按照正常网页开发流程，进行网页开发即可5 使用百分比和rem替换px 代码效果对比*使用固定像素*box float left width 658px fontsize 72px textalign。

lthtml ltscript type=quottextjavascriptquot src=quotjsjquery1113minjsquotltscript ltscript type=quottextjavascriptquot 判断pc浏览器是否缩放，若返回100则为默认无缩放，如果大于100则是放大，否则缩小 function detectZoom var ratio = 0，screen = windowscreen，ua = navigator。

HTML5的移动端网页设计稿，通常情况下，内容区为750px或960px或者1080px的，一般不小于750px像素大小宽度设计稿可以比750px大，但是绝对不能比750px小，这个主要是由于当前手机的分辨率相对较高iPhone6是375物理像素，但实际像素为其两倍，也就是750，这个750就是这么来的如果设计图稿过小，前端。

1，输入positionfixedtop0left0将整个div固定在屏幕的顶部和左侧2输入width100％height100％min－width1000px这个可以适合div的高度和宽度，而min－width是为了实现让屏幕宽度在1000px以内时，div的大小保持不变3输入backgroundsize coverwebkitbackgroundsize。

HTML5的移动端网页设计稿，通常情况下，内容区为750px或960px或者1080px的，一般不小于750px像素大小宽度设计稿可以比750px大，但是绝对不能比750px小，这个主要是由于当前手机的分辨率相对较高iPhone 6是375物理像素，但实际像素为其两倍，也就是750，这个750就是这么来的如果设计图稿过小。

移动端的h5页面的尺寸是多少H5的尺寸一般设计为640x1136px 既满足了显示需求，又能降低用户加载图片需要的带宽可以用各种分辨率的移动智能手机查看我们设计的H5页面时，当然，也会出现如下的情况，内容显示不全，甚至一些重要内容和按钮都会被遮挡第一背景图片必须采用backgroundsizecover来实现第。

手机的屏幕有大有小，移动web最好做成响应式布局，也就是自适应屏幕，没有固定宽高，这样的话，在所有手机上都可以正常显示ico的话可以使用字体图标，现在大部分手机浏览器都支持html5和css3的Web前端开发工程师是一个很新的职业，在国内乃至国际上真正开始受到重视的时间不超过7年Web前端开发是从。

由于HTML5和微信内置浏览器的火爆，移动端H5网页越发流行在设计制作移动端网页的时候，你是否疑惑，这种网站设计稿应该做成的多少屏宽，是否应该跟手机的分辨率一致，还是应该按照iPhone的分辨率来设计注意H5网页区别于APP，APP的设计稿直接按照手机分辨率来设计？那么对于现在2K屏幕的手机，应该如何制作设计稿和前端稿呢。

html5 label定长不随文字的多少改变大小，这个的话，我们是可以通过CSS来搞定的，设置label的width，height，那样他自然它的大小就不能被改变，这里我写一段代码 label width300px height200px Male Female。

3无论什么元素，一旦设置为是浮动显示，就拥有了完整的盒模型结构，我们就可以使用外边距，内边距，边框，高和宽来控制的大小以及与其他对象之间的位置关系4浮动是从网页布局的角度来定义元素的显示，而行内和块状属性主要是从元素自身的性质来定其显示的5当元素没有定义边框时，可以把内边距。

3相对大小的字体 字体也不能使用绝对大小px，而只能使用相对大小embody font normal 100% Helvetica， Arial， sansserif 上面的代码指定，字体大小是页面默认大小的100%，即16像素h1 fontsize 15em 然后，h1的大小是默认大小的15倍，即24像素2416=15s。

上面是A3纸的大小，body的大小要设置成3508*4961像素，一般网页需要72分辨率就行，但是如果打印出来就需要是300像素。