请问如何给这些蓝色方 block 之间的白色区域上色？ 我有这个代码
#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 代码以在帖子中显示)
最佳答案
试试这个:
#nav {
background: #0568CD;
display:block;
overflow: auto;
}
将#nav 设置为 block 将使其成为全宽，而 overflow:auto 意味着它将扩展到 float 元素的高度。
关于css - 我如何使用CSS为白色区域着色，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18193057/