css 各浏览器兼容问题。ie8兼容, ie6,火狐不同,求大虾解决。
<head><styletype="text/css">#head{width:790px;height:100px;border:1pxsolid#ABABAB;}#l...
<head>
<style type="text/css">
#head { width:790px; height:100px; border:1px solid #ABABAB;}
#left { width:170px; height:700px; float:left; border:1px solid #ABABAB;}
#main { width:610px; height:700px; border:1px solid #ABABAB; margin-left:180px;}
#bottom { width:790px; height:60px; border:1px solid #ABABAB;}
.yo { width:790px; margin:0 auto;}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<table class="yo">
<div id="head"></div><br/>
<div id="left"></div>
<div id="main"></div><br/>
<div id="bottom"></div>
</table>
</body> 展开
<style type="text/css">
#head { width:790px; height:100px; border:1px solid #ABABAB;}
#left { width:170px; height:700px; float:left; border:1px solid #ABABAB;}
#main { width:610px; height:700px; border:1px solid #ABABAB; margin-left:180px;}
#bottom { width:790px; height:60px; border:1px solid #ABABAB;}
.yo { width:790px; margin:0 auto;}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<table class="yo">
<div id="head"></div><br/>
<div id="left"></div>
<div id="main"></div><br/>
<div id="bottom"></div>
</table>
</body> 展开
3个回答
展开全部
table里没有行列是不行的,你要不就用div,要不就用行列。另外,div默认本来就是换行的,你用br来控制没有丝毫意义。样式也需要修改一下:
<head>
<style type="text/css">
#head { width:698px; height:100px; border:1px solid #ABABAB;clear:both;}
#left { width:170px; height:700px; float:left; border:1px solid #ABABAB;}
#main { width:610px; height:700px; border:1px solid #ABABAB; float:left;margin-left:10px;}
#bottom { width:790px; height:60px; border:1px solid #ABABAB; clear:both;}
.yo { width:698px; margin:0 auto;}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<table class="yo">
<tr><td>
<div id="head"></div>
<div id="left"></div>
<div id="main"></div>
<div id="bottom"></div>
</tr></td>
</table>
</body>
希望对你有所帮助。
<head>
<style type="text/css">
#head { width:698px; height:100px; border:1px solid #ABABAB;clear:both;}
#left { width:170px; height:700px; float:left; border:1px solid #ABABAB;}
#main { width:610px; height:700px; border:1px solid #ABABAB; float:left;margin-left:10px;}
#bottom { width:790px; height:60px; border:1px solid #ABABAB; clear:both;}
.yo { width:698px; margin:0 auto;}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<table class="yo">
<tr><td>
<div id="head"></div>
<div id="left"></div>
<div id="main"></div>
<div id="bottom"></div>
</tr></td>
</table>
</body>
希望对你有所帮助。
展开全部
这是代码本身就写错了,Table里如果没有<tr></tr>,<td></td>表格是不起作用的,而IE8中显示正常是因为IE会自动识别。
建议使用><tr>,<td>布局,或者直接用DIV来布局。
建议使用><tr>,<td>布局,或者直接用DIV来布局。
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
以下是我调试过且通过了的标准代码符合W3C标准,你可以直接拿着用,也符合你上面的要求:
<!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=gb2312" />
<style type="text/css">
body { font-family:Verdana; font-size:14px; margin:0;}
#container {margin:0 auto; width:900px;}
#header { height:100px; background:#6cf; margin-bottom:5px;}
#menu { height:30px; background:#09c; margin-bottom:5px;}
#mainContent { height:500px; margin-bottom:5px;}
#sidebar { float:left; width:200px; height:500px; background:#9ff;}
#content { float:right; width:695px; height:500px; background:#cff;}
#footer { height:60px; background:#6cf;}
</style>
</head>
<body>
<div id="container">
<div id="header">头部</div>
<div id="menu">This is the Menu</div>
<div id="mainContent">
<div id="sidebar">This is the sidebar</div>
<div id="content">这就是你要的效果!—</div>
</div>
<div id="footer">This is the footer</div>
</div>
</body>
</html>
<!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=gb2312" />
<style type="text/css">
body { font-family:Verdana; font-size:14px; margin:0;}
#container {margin:0 auto; width:900px;}
#header { height:100px; background:#6cf; margin-bottom:5px;}
#menu { height:30px; background:#09c; margin-bottom:5px;}
#mainContent { height:500px; margin-bottom:5px;}
#sidebar { float:left; width:200px; height:500px; background:#9ff;}
#content { float:right; width:695px; height:500px; background:#cff;}
#footer { height:60px; background:#6cf;}
</style>
</head>
<body>
<div id="container">
<div id="header">头部</div>
<div id="menu">This is the Menu</div>
<div id="mainContent">
<div id="sidebar">This is the sidebar</div>
<div id="content">这就是你要的效果!—</div>
</div>
<div id="footer">This is the footer</div>
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询