用户名:  密码:   
您当前的位置:首页 > 网页设计 >  Html+CSS > 

手机网页手机自适应网页

上次修改时间: 2017-04-10 11:16:32      来源:网络总结      作者:钢铁长陈
上一页      路径:DSD\Learn\Html与CSS\      下一页

让手机打开网页后自适应网页的宽度
在title行的上一行加上如下代码:
<meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">

例:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<title>CJ103速溶咖啡粉</title>
</head>
<body>
<table width="100%" border="0">
  <tr>
    <td class="STYLE1">
      <div align="right"><img src="logo2.jpg" width="102" height="50" />  </div>
    </td>
  </tr>
  <tr>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td><strong>CJ103</strong><strong>速溶咖啡粉</strong><strong> </strong></td>
  </tr>
  <tr>
    <td><strong>产   地:越南 </strong></td>
  </tr>
  <tr>
    <td>成分:100%绿咖啡豆 </td>
  </tr>
</table>

</body>
</html>