我在Chrome 检查下的效果是好的，但是在HBuilder里面的边看边改里面，布局被打乱了。请问有什么好的解决办法吗？
样子如下：
l***@163.com
- 发布：2016-09-07 17:34
- 更新：2016-09-07 17:55
- 阅读：1869
Trust - 少说废话
web浏览器下有个设置的按钮，调整下分辨率。
或者在html中添加meta节点。
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no"> l***@163.com (作者)
这个页面的代码如下，麻烦客服能帮我看一下吗？ 除了img这就是全部的页面了。 谢谢
<!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" />
<title>航班详情</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<style>
html,
body {
background-color: #fff;
font-size: 10px;
font-family: "微软雅黑";
}
.head_top {
position: fixed;
height: 210px;
width: 100%;
background-image: url(img/bg2.png);
background-size: cover;
margin: 0 auto;
left: 0px;
right: 0px;
top: 0px;
text-align: center;
color: #fff;
font-size: 4.8rem;
}
.fanhui {
position: fixed;
height: 56px;
width: 160px;
left: 31px;
color: #fff;
font-size: 4.8rem;
top: 106px;
}
.huise {
position: fixed;
height: 249px;
width: 100%;
left: 0px;
right: 0px;
top: 0px;
background-color: #f6f5fa;
border-bottom: 1px solid #e6e5ea;
z-index: -9;
}
.radius {
border: 1px solid #e6e5ea;
border-radius: 12px;
-webkit-border-radius: 12px;
-moz-border-radius: 12px;
}
img {
border: none;
}
.zhengwen {
position: absolute;
height: 100px;
margin: 0 auto;
top: 249px;
left: 1px;
right: 0px;
color: #6a94e1;
z-index: -99;
}
.zhengwen tr td {
height: 150px;
border-bottom: 1px solid #e6e5ea;
}
.dibu {
position: fixed;
bottom: 0px;
left: 0px;
right: 0px;
height: 150px;
width: 100%;
background-color: #f6f5fa;
z-index: 20;
border-top: solid 1px #e6e5ea;
font-size: 3rem;
color: #a6a5aa;
line-height: 48px;
}
.zuodq {
padding-left: 84px;
}
.youdq {
padding-right: 84px;
}
.mid {
text-align: center;
}
.gg {
line-height: 150px;
font-size: 3.7rem;
}
.jihua {
position: absolute;
background-color: #6a94e1;
width: 167px;
height: 66px;
font-size: 3.4rem;
line-height: 58px;
color: #fff;
text-align: center;
right: 84px;
top: 186px;
border: none !important;
padding-top: 10px;
}
.bgdiv {
position: absolute;
background-color: #6a94e1;
width: 332px;
height: 186px;
font-size: 3.4rem;
line-height: 58px;
color: #fff;
text-align: center;
top: 452px;
border: none !important;
}
.bgdiv1 {
left: 84px;
}
.bgdiv2 {
right: 84px;
}
.jcwz {
padding-top: 30px;
}
.sanfenlan {
height: 100%;
width: 100%;
background-color: #f6f5fa;
margin: 0 auto;
border: none;
}
.sflwz {
text-align: center;
font-size: 3.6rem;
color: #6a94e1;
padding-top: 35px;
line-height: 58px;
}
</style>
</head>
<body>
<div class="head_top">
<div style=" padding:106px 0 48px 0;">航班详情</div>
</div>
<a href="index.html">
<div class="fanhui"><img src="img/zjt.png" width="31" height="56" style="margin-bottom:-10px;" /> 返回</div>
</a>
<div class="huise"></div>
<div class="zhengwen">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="50%" class="zuodq gg"><span style="font-weight:bolder;">SC4728 </span>山东航空</td>
<td width="50%" align="right" class="youdq gg">准点率：26.67%</td>
</tr>
<tr>
<td class="zuodq gg">日期：2016-08-29</td>
<td align="right" class="gg" style="padding-right:251px; ">状态：
<div class="jihua radius">计划</div>
</td>
</tr>
<tr>
<td class="mid gg" style="color:#b6b5ba; border-right:1px solid #e6e5ea; border-bottom:none;">始发地</td>
<td class="mid gg" style="color:#b6b5ba; border-bottom:none;s">目的地</td>
</tr>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<div class="bgdiv bgdiv1 radius">
<div class="jcwz">KWL<br/>两江国际机场</div>
</div>
</td>
<td align="center" valign="middle" style="height:185px !important; border-bottom:none;"><img src="img/to.png" width="77" height="146" /></td>
<td>
<div class="bgdiv bgdiv2 radius">
<div class="jcwz">KWL<br/>烟台蓬莱国际机场</div>
</div>
</td>
</tr>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="center" width="50%" valign="middle" style="height:240px; border-right:1px solid #e6e5ea;"><img src="img/3001.png" width="126" height="156" /></td>
<td align="center" valign="middle"><img src="img/30002.png" width="104" height="155" /></td>
</tr>
<tr>
<td class="zuodq gg" style="border-right:1px solid #e6e5ea;">计划起飞时间：12:00</td>
<td align="right" class="youdq gg">计划到达时间：13:50</td>
</tr>
<tr>
<td class="zuodq gg" style="border-right:1px solid #e6e5ea;">实际起飞时间：12:00</td>
<td align="right" class="youdq gg">实际到达时间：13:49</td>
</tr>
</table>
<table width="93%" border="0" cellspacing="50px" cellpadding="0" style=" margin-left:34px; margin-right:34px;">
<tr>
<td width="33%" style=" height:186px; border:none;">
<div class="sanfenlan radius">
<div class="sflwz">26<br/>登机口</div>
</div>
</td>
<td width="34%" style=" border:none;">
<div class="sanfenlan radius">
<div class="sflwz">C岛01-32<br/>值机柜台</div>
</div>
</td>
<td width="33%" style=" border:none;">
<div class="sanfenlan radius ">
<div class="sflwz">11<br/>行李闸口</div>
</div>
</td>
</tr>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td style="border-top:1px solid #e6e5ea; height:400px;"> </td>
</tr>
</table>
</div>
<div class="dibu">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="25%" height="91" align="center" valign="bottom"><img src="img/00001.png" width="77" height="72" /></td>
<td width="25%" align="center" valign="bottom"><img src="img/100002.png" width="86" height="68" /></td>
<td width="25%" align="center" valign="bottom"><img src="img/100003.png" width="79" height="70" /></td>
<td width="25%" align="center" valign="bottom"><img src="img/100004.png" width="70" height="72" /></td>
</tr>
<tr>
<td align="center" style="color:#6a94e1;">首页</td>
<td align="center">消息</td>
<td align="center">交友</td>
<td align="center">我</td>
</tr>
</table>
</div>
</body>
</html>
l***@163.com (作者)
谢谢回复，但是我已经加了，还是不对呢
2016-09-07 17:54