1

リスト項目のホームの背景を変更して、ホバーしていない場合でもホバー プロパティがあることを確認しようとしています。クラスを使って言及しても、テキストは変わりません。

HTML :

         <div id="header">
     <img id="logo" src="images/logo.jpg">
     <ul>
     <li> <a href="#">CONTACT</a> </li>
     <li> <a href="#">GALLERY</a> </li>
     <li> <a href="#">EVENTS</a> </li>
     <li> <a href="#" class="currentpage">HOME </a> </li>
     </ul>          
     </div>

CSS :

       #header ul {
        padding-top:1em;
          }

       #header ul li a.currentpage {
        color:white !important;
        background-color: #F96E5B !important;
       }

       #header ul li a {
        text-decoration: none;
        color:#676767;
        font-family: 'Oswald', sans-serif;
        font-size: 1em;
        float:right;
        line-height: 3em;
        padding-right: 1em;
        padding-left:1em;
           }

          #header ul li a:hover{
      background-color: #F96E5B;
          }

http://ashwin931996.webege.com

4

2 に答える 2

0

投稿したページ/リンクからコードを確認した後、指定したアイテムのタグの背景色を変更したいようですid="selected"

ターゲットにしたいCSSは次のとおりです。

#header ul li a#selected {background:red /* or whatever color you want it */ }
于 2012-10-30T13:28:31.230 に答える
0

このコードを試してください

<li>
<a  class="one" href="#">CONTACT</a>
</li>
<li>
<a class="two" href="#">GALLERY</a>
</li  class="one">
<li>
<a class="three" href="#">EVENTS</a>
</li>
<li>
<a class="four" href="#">HOME </a>
</li>

CSS

#header ul li a.one:hover
{background-color: #F96E99;
color: white;}
#header ul li a.two:hover
{background-color: #F96E22;
color: white;}
#header ul li a.three:hover
{background-color: #F96Eaa;
color: white;}
#header ul li a.four:hover
{background-color: #F96E55;
color: white;}

デモ ; http://jsfiddle.net/PbMg2/1/

別のクラスのホバー機能について言及する必要があります。これがお役に立てば幸いです。

于 2012-10-30T13:29:42.753 に答える