設置頁面一部分的鏈接樣式，而不是另一部分

Question

首先，我想感謝您的到來，這幾天來我比過去六個月在異地學習到的更多，所以這里的道具！ 我的問題是困擾我很長時間的問題，我找不到合適的答案，也許我是在問錯問題。 基本上，我的標題導航有一些鏈接，我希望在不影響頁面上其余鏈接的情況下自定義這些鏈接。 我希望他們使用純CSS在鼠標懸停時更改顏色，而無需更改主體中的鏈接。 由於a：link a：visited等似乎是他們自己的課程，所以我該怎么做：/預先謝謝！

Answer 1

只需使用父選擇器，包裝您要編輯的鏈接，而無需在包裝器中更改其他任何鏈接

html

<div id="header"><a href="">styled link</a></div>
<a href="">not styled link</a>

的CSS

#header a, #header a:active, #header a:link, #header a:visited { color: white }
#header a:hover { color: blue }

還請注意，由於安全問題，最新版本的Firefox和chrome不支持：visited偽類

Answer 2

的HTML：

<a class='fancylink'>Hi</a>
<a>No Fancy Link</a>

CSS：

.fancylink{
    color:blue;
    text-decoration:none;
}

.fancylink:hover{
    color:yellow;
}

它不是設計的主要內容，但可以回答您的問題。 =）

Answer 3

<div class="firstbit">
   <a href=......

</div>

然后

.firstbit a,
.firstbit a:hover
{
   Style stuff here
}

然后執行相同操作，但更改類的名稱

Answer 4

您想在CSS中使用特異性。 這可以通過多種方式完成。

方法1：類

首先，向所有導航鏈接添加一個類似的類，例如<a href="#" class="classname"></a>

其次，在CSS中，添加

a.classname:link {} 
a.classname:visited {} 
/* etc */

方法2：容器

首先，將所有導航鏈接分組在稱為容器的標簽內

<div id="idname">
<a href="#"></a>
<a href="#"></a>
</div>

二，在CSS中

#idname a:link {}
#idname a:visited{}
/* etc */

Answer 5

CSS選擇器有多個部分，以空格分隔。 這些部分中的每一個都從上一部分的子項（或子項的子項，依此類推）中選擇，如果是最后一部分，則選擇整個頁面。 （如果里面有>之類的，這種行為就會改變，但這與這個問題無關）

這些部分中的每個部分都可以具有多個用於過濾的內容。 例如，您提到a:link 。 這是兩個部分： a ，它過濾到a標簽，和:link ，它過濾到鏈接。 如果將它們放在一起，它會顯示“鏈接a標簽”。

如果您使用此ID為選擇器（ #id ），你可以制造類似#header a:link ，這將只針對a標簽，它是其中有一個元素鏈接id的header 。