61,112
社区成员
发帖
与我相关
我的任务
分享css+div布局不是想要的
我想实现这样的布局：
头部：header.html
中间：分两部分，左部分是menu.html，右边是introduction.html
底部：footer.html
结果与我期望的不同：头部是OK的，但是底部总是和中间两部分混在一起。不知道是什么原因，请高手帮看下，谢谢。。。
代码如下：
<!--%@ page contentType="text/html; charset=gb2312"%-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>国强工业有限公司|气动元件公司</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
</head>
<LINK href="./css/index.css" type=text/css rel=stylesheet >
<body>
<!--table width="100%" border="0" cellspacing="0" cellpadding="0" -->
<div style="width: 100%; border:0 ;float: left; align:center">
<iframe width="100%" height=165 frameborder="0" scrolling="NO" id="header_index" name="header_index" src="./header.html"> </iframe>
</div>
<div>
<div>
<font size=3 style="font-size:14; margin-top: 2px;background-color:0X000000;width: 30%; float: left;">
<iframe width="100%" height="100%" frameborder="0" scrolling="NO" id="productmenu_index" name="productmenu_index" src="./menu.html"> </iframe>
</style>
</div>
<div>
<font size=3 style="font-size:14; margin-top: 2px;background-color:0X000000;width: 70%; float: right;">
<iframe width="100%" height="100%" frameborder="0" scrolling="NO" id="newsroll_index" name="newsroll_index" src="./introduction.html"> </iframe>
</style>
</div>
</div>
<div style="width: 100%; height:100%;border:0 ;float: left; align:center">
<iframe width="100%" height="100%" frameborder="0" scrolling="NO" id="footer_index" name="footer_index" src="./footer.html"> </iframe>
</div>
</body>
</html>
头部：header.html
中间：分两部分，左部分是menu.html，右边是introduction.html
底部：footer.html
结果与我期望的不同：头部是OK的，但是底部总是和中间两部分混在一起。不知道是什么原因，请高手帮看下，谢谢。。。
代码如下：
<!--%@ page contentType="text/html; charset=gb2312"%-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>国强工业有限公司|气动元件公司</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
</head>
<LINK href="./css/index.css" type=text/css rel=stylesheet >
<body>
<!--table width="100%" border="0" cellspacing="0" cellpadding="0" -->
<div style="width: 100%; border:0 ;float: left; align:center">
<iframe width="100%" height=165 frameborder="0" scrolling="NO" id="header_index" name="header_index" src="./header.html"> </iframe>
</div>
<div>
<div>
<font size=3 style="font-size:14; margin-top: 2px;background-color:0X000000;width: 30%; float: left;">
<iframe width="100%" height="100%" frameborder="0" scrolling="NO" id="productmenu_index" name="productmenu_index" src="./menu.html"> </iframe>
</style>
</div>
<div>
<font size=3 style="font-size:14; margin-top: 2px;background-color:0X000000;width: 70%; float: right;">
<iframe width="100%" height="100%" frameborder="0" scrolling="NO" id="newsroll_index" name="newsroll_index" src="./introduction.html"> </iframe>
</style>
</div>
</div>
<div style="width: 100%; height:100%;border:0 ;float: left; align:center">
<iframe width="100%" height="100%" frameborder="0" scrolling="NO" id="footer_index" name="footer_index" src="./footer.html"> </iframe>
</div>
</body>
</html>
...全文
请发表友善的回复…
发表回复
missgd152 2011-08-08
- 打赏
- 举报
<!--%@ page contentType="text/html; charset=gb2312"%-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>国强工业有限公司|气动元件公司</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
</head>
<LINK href="./css/index.css" type=text/css rel=stylesheet >
<body>
<!--table width="100%" border="0" cellspacing="0" cellpadding="0" -->
<div style="width: 100%; border:0 ;float: left; align:center">
<iframe width="100%" height=165 frameborder="0" scrolling="NO" id="header_index" name="header_index" src="./header.html"> </iframe>
</div>
<div style="width:100%;border:0;float:left">
<div style="float:left">
<font size=3 style="font-size:14; margin-top: 2px;background-color:0X000000;width: 30%; float: left;">
<iframe width="100%" height="100%" frameborder="0" scrolling="NO" id="productmenu_index" name="productmenu_index" src="./menu.html"> </iframe>
</style>
</div>
<div style="float:left">
<font size=3 style="font-size:14; margin-top: 2px;background-color:0X000000;width: 70%; float: right;">
<iframe width="100%" height="100%" frameborder="0" scrolling="NO" id="newsroll_index" name="newsroll_index" src="./introduction.html"> </iframe>
</style>
</div>
</div>
</body>
</html>
你TOP设置了样式，但是你center就没设置样式了，也没设置flaot悬浮状态，所以就显得中间和button底部有问题了。你同样在第二个div处设置一下float，width等，效果就出来了。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>国强工业有限公司|气动元件公司</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
</head>
<LINK href="./css/index.css" type=text/css rel=stylesheet >
<body>
<!--table width="100%" border="0" cellspacing="0" cellpadding="0" -->
<div style="width: 100%; border:0 ;float: left; align:center">
<iframe width="100%" height=165 frameborder="0" scrolling="NO" id="header_index" name="header_index" src="./header.html"> </iframe>
</div>
<div style="width:100%;border:0;float:left">
<div style="float:left">
<font size=3 style="font-size:14; margin-top: 2px;background-color:0X000000;width: 30%; float: left;">
<iframe width="100%" height="100%" frameborder="0" scrolling="NO" id="productmenu_index" name="productmenu_index" src="./menu.html"> </iframe>
</style>
</div>
<div style="float:left">
<font size=3 style="font-size:14; margin-top: 2px;background-color:0X000000;width: 70%; float: right;">
<iframe width="100%" height="100%" frameborder="0" scrolling="NO" id="newsroll_index" name="newsroll_index" src="./introduction.html"> </iframe>
</style>
</div>
</div>
</body>
</html>
你TOP设置了样式，但是你center就没设置样式了，也没设置flaot悬浮状态，所以就显得中间和button底部有问题了。你同样在第二个div处设置一下float，width等，效果就出来了。
MuBeiBei 2011-08-07
- 打赏
- 举报
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>国强工业有限公司|气动元件公司</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
</head>
<LINK href="./css/index.css" type=text/css rel=stylesheet >
<body>
<!--table width="100%" border="0" cellspacing="0" cellpadding="0" -->
<div style="width: 100%; border:0 ;float: left; align:center">
<iframe width="100%" height=165 frameborder="0" scrolling="NO" id="header_index" name="header_index" src="./header.html"> </iframe>
</div>
<div style="width:100%">
<div style="float:left;width: 30%; margin-top: 2px;">
<iframe width="100%" height="100%" frameborder="0" scrolling="NO" id="productmenu_index" name="productmenu_index" src="./menu.html"> </iframe>
</div>
<div style="float:left;width: 70%; margin-top: 2px;">
<iframe width="100%" height="100%" frameborder="0" scrolling="NO" id="newsroll_index" name="newsroll_index" src="./introduction.html"> </iframe>
</div>
</div>
<div style="clear:both;"></div>
<div style="width: 100%;border:0 ;">
<iframe width="100%" height="100%" frameborder="0" scrolling="NO" id="footer_index" name="footer_index" src="./footer.html"> </iframe>
</div>
</body>
</html>