请教大神，急！！！在线等~~

[weiwangwang521]

我现在在做一个移动端的自适应网站，现在遇到一个问题，手机的高度不一样，我怎么用代码去实现适应各种不同高度手机屏幕的页面？宽度都没有问题。

[DaveLeeCN]

响应式布局问题，两种方案：一种是流式布局，宽高设置百分比；另外一种是使用css media query，给不同高度或宽度的显示器定义不同的css模板，具体百度。

[weiwangwang521]

引用 1 楼 DaveLeeCN 的回复:

响应式布局问题，两种方案：一种是流式布局，宽高设置百分比；另外一种是使用css media query，给不同高度或宽度的显示器定义不同的css模板，具体百度。

这两种我都用了，现在的问题是设置百分比之后，发现他的body没有全部铺满整个屏幕，就只铺了一半，导致下面的空很多。

[DaveLeeCN]

CSS:

*{
	margin: 0;
	padding: 0;
}

html,body{
	width: 100%;
	height: 100%;
}

[weiwangwang521]

引用 3 楼 DaveLeeCN 的回复:

CSS:

*{
	margin: 0;
	padding: 0;
}

html,body{
	width: 100%;
	height: 100%;
}

我是这么写的： @media(max-width:360px){ .nav>.box>ul>li{margin: 4% auto} } @media (min-width:480px) and (max-width:640px){ .nav>.box>ul>li{padding: 50px auto} } @media (min-width:640px) and (max-width:720px){ .nav>.box>ul>li{padding: 50px auto} } @media (min-width:720px) and (max-width:960px){ .nav>.box>ul>li{padding: 50px auto} } @media (min-width:960px) and (max-width:1080px){ .nav>.box>ul>li{padding: 50px auto} } @media (min-width:1080px) and (max-width:1920px){ .nav>.box>ul>li{padding: 20px auto} } 可是在手机上只读取了第一个样式，我换了好几个不同的手机，手机屏幕大小也不一样，还是不行呢。

[风中的少年]

在用固定像素值是：如 padding:20px auto，是会的。见意不用padding：20px auto这种方式，如果实在没其他办法取代，那也不要用像素px,改用em试试.

[Fsmecx]

复制其他网页初始化代码即可

[我本俗人]

施主的意思难道不是，想让块区高度等于屏幕高度么？

[风中剑客]

响应式布局问题，两种方案：一种是流式布局，宽高设置百分比；另外一种是使用css media query，给不同高度或宽度的显示器定义不同的css模板

[JPF1024]

参考框架： bootstrap ,中文:www.bootcss.com 或者用 妹子UI，网址：http://amazeui.org/