我要粘贴到这里的代码在 FF、IE6 和 Opera 中显示了不同的结果。
FF 和 Opera 的结果之间的区别在于水平菜单上方(天空颜色)和下方(白色)显示的空间量。在 IE6 的情况下，与 FF 结果的不同之处在于水平菜单下方显示的空间量(白色)。如何让所有 3 个浏览器显示相同的结果，即 FF 的当前结果？
HTML代码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title>fffffff</title>
<link rel="stylesheet" href="css/main.css" type="text/css"/>
</head>
<body>
<div id="header">
<div class="header_inside">
<div class="logo">
<img src="img/img_flwr.png" width="224px" height="162px" >
</div> <!-- end of class logo-->
<div class="chat">
<a href="phponline/client.php" target="_blank"><img src="img/img_flwr.png" width="124px" height="62px"></a>
</div>
<div class="clear">
</div>
<div class="name">
<marquee behavior="scroll" direction="RIGHT" scrollamount='5' scrolldelay='25' >
CODE ARROW
</marquee>
</div> -->
<div id="slides">
<img src="img/img_1.jpg" alt="Img 1" width="815px" height="268px" />
</div>
<div class="clear">
</div>
<br>
</div> <!-- end of class header_inside-->
</div> <!-- end of header-->
<div class="menu_h">
<div class="menu_h_inside">
<br>
<ul>
<li><a href="index.php" id="home_nav" >Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Products</a></li>
<li><a href="#">News</a></li>
<li><a href="gallery_core.php?page=1" id="image_gallery_nav">Photo Gallery</a></li>
<li><a href="#">Video Gallery</a></li>
<li><a href="#">Career</a></li>
<li><a href="#">Contact</a></li>
</ul>
<br style="clear:left"/>
</div> <!-- end of class menu_h_inside-->
</div>
</body>
</html>
CSS 是:
/* CSS Document */
*{
padding:0;
margin:0;
}
body{
width: 1160px;
/*background:#BFFDC4 !important;*/
margin-left: 20px;
/*border:4px solid red;*/
}
#frame {
/*width: 710px;*/
width: 1125px;
/*BORDER:12PX SOLID RED;*/
/*border:7px solid green;*/
}
#header{
position:relative:
display:block;
/*border:10px solid green;*/
width:1160px;
background:#9DD4FF;
}
.header_inside{
}
body#home a#home_nav,
body#image_gallery a#image_gallery_nav
{
background-color:#0b75b2 !important;
}
.logo{
position:relative;
left:3px;
top:3px;
float:left;
/*border: 8px solid #F2AC4E;*/
}
.chat{
position:relative;
float:left;
display:inline-block;
margin-left:100px;
margin-top:15px;
/*border:13px solid red;*/
}
.chat img:hover{
}
.clear{
clear:both;
}
.name{
position:relative;
display:block
clear:both;
width:300px;
height:50px;
MARGIN-TOP:75PX;
background-color:#000000;
color:#FFFF80;
font-size:40px;
}
#slides{
position:relative;
left:300px;
MARGIN-top:-180px;
FLOAT:LEFT;
}
/* horizontal menu_h css begins*/
.menu_h{
position:relative;
margin-top:20px;
width: 1145px;
/*border:5px solid yellow;*/
}
.menu_h ul{
margin: 0; padding: 0;
float: left;}
.menu_h ul li{
display: inline;
}
.menu_h ul li a{
float: left; text-decoration: none;
color: white;
padding: 10.5px 44.6px;
/*background-color: #333; EDITED BY ME */
background-color:#C7A781;
border-right: 1px solid #FFFFFF;
}
.menu_h ul li a:visited{
color: white;}
.menu_h ul li a:hover, .menu_h ul li .current{
color: #fff;
background-color:#0b75b2;}
/* horizontal menu_h css ended */
.menu_h_inside{
margin-left:1px;
/*margin-top:7px;*/
}
图像应该用在适当的地方。
提前致谢。 伊斯蒂亚克艾哈迈德 孟加拉国
最佳答案
您的问题很可能是由到处都是浏览器默认样式表引起的。在花费大量时间尝试调试问题之前，您应该考虑添加良好的 CSS 重置。这个来自提出第一个通用重置的人。它工作得很好。
关于php - firefox , IE6 和 opera 有不同的表现，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5146446/