更改子代：將鼠標懸停在父代之前，在CSS之前

Question

就像標題所說的那樣，我正在嘗試將childs：更改為css時，將鼠標懸停在父級上。 我運氣不好

.ParentClass:hover .ChildClass:Before{
    color:#0000F;
}

我嘗試過的工作：以下所有工作都可以，但它們不是我想要的：

更改子級屬性，但我嘗試更改子級：之前

.ParentClass:hover .ChildClass{
    color:#0000F;
}

當我希望將鼠標懸停在父對象上時，這一變化將發生在我的上方：

.ParentClass .ChildClass:hover:before{
    color:#0000F;
}

我可以使用javascript做到這一點，但如果可能的話，我正在尋找純CSS。

Answer 1

您的第一次嘗試是如此接近。 您必須使用before （小寫）來代替Before 。 因此，這將很好地工作：

.ParentClass:hover .ChildClass:before {
    color: #00000F;
}

無論如何，如果這行不通，請向我們提供完整的HTML和CSS代碼，以進一步為您提供支持。

Answer 2

問題在於您的顏色語法。 每種顏色（rgb）使用兩個十六進制數字：

代替這個：

color: #0000F;

… 做這個：

color: #0000FF;

您還可以為每種顏色做一個十六進制數字：

color: #00F;

 .ParentClass:hover .ChildClass:Before { color: #0000FF; } .ChildClass:Before { content: 'Lorem'; color: red; } 

 <div class="ParentClass"> <span class="ChildClass">Ipsum</span> </div> 

Answer 3

顏色十六進制有錯誤：

錯誤：顏色：＃0000F;

正確地：color：＃00000F;