将悬停悬停应用于除第一个元素之外的所有元素

Apply hover on all elements except the first

本文关键字：悬停 元素 第一个 应用于      更新时间：2023-09-26

我有各种元素，当我悬停它们时，我希望除了第一个孩子之外，它们都有一个背景。

这是我的CSS选择器：

#OfficeUI .iconHolder img:hover:not(:first-child) { background-color: #CDE6F7; }

这是怎么回事？

相关网页

        <div class="officeui-position-absolute iconHolder">
            <!-- Provides the images on the top left of the ribbon. -->
            <top-Images-Container>
                <span ng-repeat="icon in icons">
                    <img src="{{icon.Icon}}" />
                </span>
            </top-Images-Container>    
        </div>


p:not(:first-child):hover {background-color: red;}
<p>first</p>
<p>second</p>
<p>third</p>

您可以使用

nth-child选择器。 n+2 使其选择除第一个元素之外的所有元素。

li:nth-child(n+2):hover {
    color:red;
}
<ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
</ul>

或者，您可以使用： 

    #OfficeUI .iconHolder img:nth-child(n + 2):hover
相关文章：