我的新网站具有内置导航并与标题图像重叠。可悲的是,在 Internet Explorer(所有版本 < 10)中,我的标题和导航都消失了。使用经典的逐行 HTML 编程的所有内容似乎都可以正常工作。我已经尝试过文档类型的修复,但无济于事。
我试着弄乱我现在的号码,什么都没有。
这是标题的 CSS:(PHP 选择随机图像)
Header
{
height: 128px;
background: url(<?php echo $selectedBg ?>);
text-indent: -9999px;
border-bottom: 0px solid #00;
padding: 0px;
margin: 0;
}
对于导航:(在此类中简单使用)
div.navigation
{
position: absolute;
top: 81px; left: 425px;
height: 47px; width:575px;
background-color: transparent;
z-index: 10;
padding: 0px;
margin: 0;
margin-left: 15px;
}
公告CSS:
div.announcement{
position: absolute;
top: 140px; left: 425px;
height: 47px; width:575px;
z-index: 20;
}
我需要做的就是在所有浏览器中正确显示。感谢任何可以提供帮助的人。
请求的代码片段:
!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<?php
$bg = array('images/header1.png', 'images/header2.png', 'images/header3.png', 'images/header4.png', 'images/header5.png', 'images/header6.png', 'images/header7.png', 'images/header8.png' ); // array of filenames
$i = rand(0, count($bg)-1); // generate random number size of the array
$selectedBg = $bg[$i]; // set variable equal to which random filename was chosen
?>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>BitFracture.com</title>
<link rel="icon" href="images/site.ico" type="image/x-icon">
<link rel="shortcut icon" href="images/site.ico" type="image/x-icon">
<link rel="stylesheet" type="text/css" href="style.css" media="screen,projection">
<link href="*" rel="stylesheet" type="text/css">
<style type="text/css">
Header {
height: 128px;
background: url(<?php echo $selectedBg ?>);
text-indent: -9999px;
border-bottom: 0px solid #00;
padding: 0px;
margin: 0;
}
</style>
</head>
<body>
<div id="container" class="clearfix">
<div class="navigation">
<a href="#"><img src="images/home.png" onmouseover="this.src='images/homeh.png'" onmouseout="this.src='images/home.png'"></a>
<a href="#"><img src="images/repairs.png" onmouseover="this.src='images/repairsh.png'" onmouseout="this.src='images/repairs.png'"></a>
<a href="#"><img src="images/articles.png" onmouseover="this.src='images/articlesh.png'" onmouseout="this.src='images/articles.png'"></a>
<a href="#"><img src="images/software.png" onmouseover="this.src='images/softwareh.png'" onmouseout="this.src='images/software.png'"></a>
</div>
<div class="announcement">
<p> <b>News:</b> Our new site is up and running!</p>
</div>
<header></header>