0

に小さな問題がありhoverます。hoverだから私はaタグの中にタグを作りたいspan、なくなった。

ここに私のHTMLファイルがあります：

<nav id="top-menu">
    <ul>
        <li> <a href="file:///C:/Users/Misha/Desktop/amazon/amazon_site/home.html">Home</a> </li>
        <li> <span><a href="">Products</a></span> </li>
        <li> <a href="">Statistics</a> </li>
        <li> <a href="">Countries</a> </li>
        <li> <a href="">Settings</a> </li>
        <li> <a href="">Contacts</a> </li>
    </ul>
</nav>

そして、ここに私のCSSファイルがあります:

nav#top-menu {
    width: 100%;
    height: 33px;
    background-color: #696969;
    margin: 0;
    padding: 0;
}

#top-menu ul {
    display: block;
    list-style-type: none;
    width: 600px;
    margin: 0 auto;
    padding: 0;
}
#top-menu ul li {
margin: 0;
padding: 0;
}

#top-menu ul li a {
    display: block;
    float: left;
    max-height: 25px;
    width: 100px;
    margin: 0;
    padding: 5px 0;
    font-family: tahoma, sans-serif;
    font-size: 20px;
    text-align: center;
    background-color: #696969;
    text-decoration: none;
    color: #FFFFFF;
    border-bottom: #696969 solid 2px;
}

#top-menu ul li a:hover { border-bottom: #FFFFFF solid 2px; }

#top-menu ul li span a{
    color: black;
}

だから私はこれを make に追加しproductshoverます。

#top-menu ul li span a:hover { }

また

#top-menu ul li span:hover { }

しかし、そうではありませんでした。誰が私が間違っているのか教えてもらえますか?

ありがとう。

4

3 に答える 3

0

スパンについて次のように言います。

span a:hover{/*Nothing here*/}

ホバー効果を無効にする必要があります。お役に立てれば。

于 2013-08-03T05:48:32.787 に答える
0

ホバーを周囲のスタイル (text-decoration:none を含む) と同じようにスタイルし、これらに !important としてフラグを付けて、ブラウザーの既定のスタイルシートをオーバーライドします。

#top-menu ul li span a:hover {
    color: #FFFFFF !important;
    border-bottom: #696969 solid 2px !important;
    text-decoration: none !important;
}

特に制御する必要があるプロパティは、「ホバー」が通常スタイルするものです。最も一般的なのは、色かもしれません。

于 2013-08-03T05:48:40.147 に答える
0

!importantのように a にホバーを追加してみてください

#top-menu ul li span a:hover {
     border-bottom: #FFFFFF solid 2px !important;
}

以前にアンカータグに border-bottom を指定したためです。

于 2013-08-03T05:45:10.017 に答える