Question

我有一个带有类页脚列表的div类，我需要将li的所有文本都改为白色。

html看起来像：

     <div id="footer-middle-left-right">
                        <div class="footer-list">
                            <ul>
                                <li>FAFSA Guide</li>
                                <li>Scholarship Finder</li>
                                <li>State Education</li>
                                <li>Ready UP</li>
                            </ul>
                        </div>
                        <div class="footer-list">
                            <ul>
                                <li>Terms of Service</li>
                                <li>Privacy Settings</li>
                                <li>FAQ</li>
                            </ul>
                        </div>
                        <div class="footer-list">
                            <ul>
                                <li>How it Works</li>
                                <li>Submit a School</li>
                                <li>Submit a Professor</li>
                                <li>Report a Misspelling</li>
                            </ul>
                        </div>
</div>

显然，为所有li添加另一个类元素是过度杀伤，而且实际上无法维护。我是css的新手，无法找出选择课程中所有li的正确方法。

我尝试过类似的事情：

.footer-list.li{
     color: white;
}

无济于事。任何有关此建议，建议阅读或任何其他CSS建议的帮助将不胜感激！我更像是一个后端人，所以这是第一个我真的不得不担心css的一部分，所以它让我有点失落！

Answer 1

实际上你在.之前添加了一个li，这使它成为一个类，所以试试这个

.footer-list li { /* This selects li inside the class .footer-list */
    color: #fff;   /* Even white is fine */
 }

或者更好的具体和使用

.footer-list ul li { /* Will apply to li which are inside ul which is inside .footer-list only */
    color: #fff;
 }

Answer 2

你的选择器：

.footer-list.li{
     color: white;
}

说“使用BOTH类选择元素页脚列表和li。”

这对于你想要的东西是不正确的，你必须在它们之间添加一个空格并删除点：

.footer-list li{
     color: white;
}

这将使用类footer-list选择任何元素中的任何<li>：）

Answer 3

只需删除li之前的点

.footer-list li{
     color: white;
}

如果它在div类中，CSS会改变li的颜色

3 个答案: