手机网站根据屏幕分辨率大小对应调用对应CSS，首先应在head中加过<meta name='viewport' content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no'>表明限值屏幕的宽度是物理宽度了。

或<meta name='viewport' content='width=device-width, initial-scale=1.0'>这句是告诉浏览器视口宽度等于设备屏幕宽度，且不进行初始缩放。

css根据屏幕分辨率大小对应调用，常见手机屏幕宽有240PX；360PX；480PX；640PX等。
当手机分辨率宽360PX时调用：
@media screen and (min-width: 360px) {
 .text{ padding-bottom:0;}
}
@media screen and (min-width: 480px) {
 .text{ padding-bottom:0;}
}

或还可在前台页面根据分辨率不同调用不同CSS：
<link rel='stylesheet' type='text/css' media='screen and (max-width: 479px)' href='http://www.studstu.com/css/pic320.css'>
<link rel='stylesheet' type='text/css' media='screen and (min-width: 479px) and (max-width: 639px)' href='http://www.studstu.com/css/pic480.css'>
<link rel='stylesheet' type='text/css' media='screen and (min-width: 639px)' href='http://www.studstu.com/css/pic640.css'>

手机网站自适应手机屏幕宽度的代码：

在网页的头部加上 <meta name='viewport' content='width=device-width, initial-scale=1' />
viewport是网页默认的宽度和高度，上面这行代码的意思是，网页宽度默认等于屏幕宽度（width=device-width），原始缩放比例（initial-scale=1）为1.0，即网页初始大小占屏幕面积的100%。
所有主流浏览器都支持这个设置，包括IE9。对于那些老式浏览器（主要是IE6、7、8），需要使用css3-mediaqueries.js。
<!--[if lt IE 9]>
<script src='http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js'></script>
<![endif]-->

不允许用户放大缩小页面、页面自适应宽度
<meta name='viewport' content='initial-scale=1, user-scalable=no'/>
  <meta name='apple-mobile-web-app-capable' content='yes'>
  <meta name='apple-mobile-web-app-status-bar-style' content='black'>
  <meta name='format-detection' content='telephone=no'>

根据屏幕不同设置对应CSS，这就是目前使用最多最广泛的手机网站自适应代码方法了。