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

background-color or backgroundその要素で css プロパティを使用します。

Google Chrome ブラウザーを使用しているように見えますが、色を付けたい要素を右クリックし、[要素の検査] をクリックします。これにより、スタイルを追加する必要がある要素が表示されます。

右側の [Styles] タブを使用して Chrome ですばやく編集してプレビューできますが、ページを更新すると失われるので、必ずコードにも設定してください。

例:

background-color: gray;

また

background: gray;

background-color色だけを設定したい場合におすすめの使い方です。また、ブラウザーによってレンダリングが異なる場合があるため、色名 (例: gray ) の代わりに 16 進コード (例: #cccccc )を使用することをお勧めします。

于 2013-08-12T17:32:58.083 に答える
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 に答える