2

请问如何给这些蓝色块之间的白色区域着色？我有这个代码

#nav{
    padding:0;
}
.rech{
    margin-left: 785px;
}
.px{
    margin-left: 3px;
}
#nav li{
    display:inline;
}
#nav li a, .rech{  
   font-family:Arial;
   font-size:12px;
   text-decoration: none;
   float:left;
   padding:10px;
   background-color: #0568CD;
   color:#ffffff;
   border-bottom:1px;
   border-bottom-color:#0568CD;
   border-bottom-style:solid;
}
#nav li a:hover{
   background-color:#9B1C26;
   padding-bottom:12px;
   border-bottom:2px;
   border-bottom-color:#000000;
   border-bottom-style:solid;
   margin:-1px;
}

这是一个屏幕截图 http://nsa34.casimages.com/img/2013/08/12/130812073042816473.jpg

这是我的 HTML 代码，

> <%@ page pageEncoding="UTF-8" %>
>     <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
>     <!DOCTYPE html>
>     <html>
>         <div>
>           <link type="text/css" rel="stylesheet" href="<c:url value="/inc/form.css"/>" />
>             <ul id="nav">
>                   <li><a href="/projetForum/accueil" class="px">Forum</a></li>
>                   <c:if test="${!empty sessionScope.sessionUtilisateur}">
>                   <li><a href="/projetForum/deconnexion">Profil</a></li>
>                       <li><a href="/projetForum/deconnexion">Se déconnecter</a></li>
>                 </c:if>
>                 <c:if test="${empty sessionScope.sessionUtilisateur}">
>                   <li><a href="/projetForum/connexion">Se connecter</a></li>
>                   <li><a href="/projetForum/inscription">S'inscrire</a></li>
>                 </c:if>
>               <li><a href="/projetForum/contactus">Nous contacter</a></li>
>               <li><input type="text" id="rechercher" name="rechercher" value="Recherche" size="20" maxlength="20" class="rech"/></li>
>           </ul>
>         </div>
>     </html>

（格式化的html代码在帖子中显示）

4

5 回答 5

1

试试这个：

#nav {
  background: #0568CD;
  display:block;
  overflow: auto;
}

将 #nav 设置为 block 将使其全宽，并且 overflow:auto 意味着它将扩展到浮动元素的高度。

于 2013-08-12T17:51:42.357 回答
0 
body{background-color:black}

此属性定义背景窗口的颜色。

我用黑色做一个例子，但你可以使用你想要的每一种颜色。

于 2013-08-12T17:30:22.060 回答
0

不知道您的 HTML 结构是什么样子有点困难，但是您是否尝试过为 ul 设置样式？

#nav ul {
  background-color: #0568CD;
}
于 2013-08-12T17:32:08.093 回答
0

background-color or background在该元素上使用css 属性。

我看到您使用的是 Google Chrome 浏览器，请在要着色的元素上按右键单击，然后单击“检查元素”。这应该显示您必须为哪个元素添加样式。

您可以使用右侧的样式选项卡快速编辑它并在 Chrome 中预览它，但请记住，当您刷新页面时，它会丢失，因此请确保您也在代码中设置它。

例子：

background-color: gray;

或者

background: gray;

background-color如果您只想设置颜色，推荐的方法是使用。此外，建议使用十六进制代码（例如#cccccc）而不是颜色名称（例如gray），因为浏览器可能会以不同的方式呈现它。

于 2013-08-12T17:32:58.083 回答
0

我希望你在 JSFiddle 上向我们展示这个，或者至少上传你的 HTML。

无论如何，我假设，根据您提供的信息：

#nav {
background-color: blue;
}
于 2013-08-12T17:38:39.153 回答