0

10 個のリンクのうち 3 個を非表示にするナビゲーション メニューがありますが、リンクがあった場所にマウスを合わせると、マウスオーバー効果が表示されます。どうすればこれを取り除くことができますか?

<!--example link-->
<a HREF="#"><span CLASS="store_link">Store Links</span></a>

//mouseover effects for all links
.header_nav a:hover {
    padding: 8px 8px;
    border-top: 4px solid #CC0078;
    border-bottom: 4px solid #CC0078;
}

//hiding the three links
.header_nav a span.search_link,
.header_nav a span.cat_link,
.header_nav a span.store_link {
    display: none;
}

//my attempt at hiding mouseover effects which does not work
.header_nav a:hover span.icon-search,
.header_nav a:hover span.cat_link,
.header_nav a:hover span.store_link {
    border-top: none;
    border-bottom: none;
}
4

1 に答える 1

2

aタグ自体ではなく、タグの内容を隠しているようですa:

.header_nav a span.search_link {display:none}

タグ全体を非表示にする必要があります。そうしないと、おそらくクラスで DOM に表示されたままになります。

<a HREF="#" class="hidden"><span CLASS="store_link">Store Links</span></a>

// CSS  
.header_nav a.hidden {display:none}
于 2013-02-07T10:40:54.853 に答える