Question

我有一个CSS文件，它将在IE中显示背景图像，但同样的背景图像不会在Firefox中。具体来说，它的标题是headerdoc图像，菜单上方的那个。

我要做的是创建一个主div部分，然后分段创建其余的布局。

是的，我知道你可以用一张桌子来做这件事，糟糕，难以管理，甚至更难维护，更不用说它丑陋，难以管理甚至更难管理。

对此的任何帮助将不胜感激。

P.S。这是我想要完成的 - 我有一个页面是屏幕的全宽和高度减去边缘2.5％的边距。这里没什么大不了的，工作得很好。

在该容器中我有一个名为#headerDoc的标题部分。那应该是父容器的整个宽度和高度的x％。在这里，我希望有一个背景覆盖这个容器的整个区域。

在标题部分，我有一个菜单部分，它只包含#headerDoc父级的底边。说10％的底部。它有自己的背景，所以它的颜色正确。

之后，我将完成整个屏幕的其余部分。但这就是我在这里尝试做的事情。

这是CSS数据：

/************************* ID's *************************/
#mainDoc {
   margin-top: 2.5%;
   margin-right: 2.5%;
   margin-bottom: 2.5%;
   margin-left: 2.5%;
   background-color: #494948;
}

#headerDoc {
   width="100%";
   height="10%";
   background-image: url('./images/bg1.jpg');
}

#menu {
   /* position: relative;*/
   width: 100%;
   height: 32px;
   margin-top: 50px;
   /* font-size: 14px;*/
   font-size: 1em;
   font-family: Tahoma, Geneva, sans-serif;
   /* font-weight: bold;*/
   text-align: center;
   /*     text-shadow: 3px 2px 1px #FFFFFF; */
   background-image: url('./images/dpmenu.gif');
   /* background-color: #8AD9FF;*/
   background-color: #494948;
   border-radius: 8px;
}

#menu ul {
   height: auto;
   padding: 8px 0px;
   margin: 0px;
}
#menu li {
   display: inline;
   padding: 10px;
}

#menu a {
   text-decoration: none;
   color: #ffffff;
   padding: 8px 8px 8px 8px;
}

#menu a:hover {
   color: #000000;
}

以下是标签的HTML使用

<html>
<head>
<link href="Style.css" rel="stylesheet" type="text/css">
<title>Css Test</title>
</head>
   <body>
   <div id="mainDoc">
      <div id="headerDoc">
         <div id="menu">
            <ul class="bdr-t bdr-b">
               <li class="bdr-r ctr"><a href="index.php">HOME</a></li>
               <li class="bdr-r ctr"><a href="classifieds.php">CLASSIFIEDS</a></li>
               <li class="bdr-r ctr"><a href="placeadd.php">PLACE AD</a></li>
               <li class="bdr-r ctr"><a href="directory.php">DIRECTORY</a></li>
               <li class="bdr-r ctr"><a href="helpdesk.php">HELP DESK</a></li>
               <li><a href="account.php">MANAGE ACCOUNT</a></li>
           </ul>
        </div>
     </div>
  </div>
</body>

很抱歉“=”我错过了那个（有一些其他我忘记了语法，但即使在改变之后它仍然没有做出差异。

Answer 1

尝试

#menu ul {... background-image：url（＆＃39; ./ images / dpmenu.gif＆＃39;）; ....}

顺便说一句，最新消息 BDR-T， BDR-B， BDR-R， ctr css class？

CSS背景图像不在Firefox中显示，但在IE中显示

1 个答案: