html - 如何找出放入 CSS 的正确目标是什么

Question

我尽了最大努力弄清楚如何定位该区域。我希望 ul 没有任何元素符号或方 block ，并且字体是黑色的。

我试过这个 css 代码，但它不起作用

.footer-wrapper .section-list > li > a {
    color: #000;
}

例如这是我的代码..

<section id="footer">
        <div class="footer-wrapper">
            <div class="container-fluid">
            <div class="line"></div>
                <div class="row">
                    <div class="col-sm-4">
                    </div>
                    <div class="col-sm-4">
                         <p class="section-list">
                            <ul>
<!-- I am trying to target this part -->
                            </ul>
                        </p>
                    </div>
                    <div class="col-sm-4 text-center">
                    </div>
                </div>
            </div>
        </div>
    </section>

Answer 1

>是针对直系后代的，这可能就是您看不到任何东西的原因

.section-list 的直系后代是 ul不是li , 因此永远不会应用该样式。

所以删除 >从 css 选择器，你会在正确的轨道上

.footer-wrapper .section-list  li  a {
    color: #000;
}

就删除元素符号而言，我建议阅读这个小教程

http://www.webreference.com/programming/css_style2/index.html

您要定位的属性是 list-style-type

所以，这样的事情会有所帮助。

.footer-wrapper .section-list  li { 
      list-style-type:none; 
      }

编辑:另外，请记住，您的颜色选择器仅适用于列表项内的任何 anchor 。如果你想让任何文本变黑，你还需要为我在答案中添加的第二种样式添加颜色。

编辑 2:您必须更改 <p>至 <div>

p元素自动关闭下一个阻塞元素。 ul是一个阻塞元素。

这意味着，即使您没有告诉它，段落也会在无序元素打开之前关闭，因此您应用于段落的任何样式实际上都不会到达列表的任何部分。

将段落更改为 div 是修复它的最好和最快的方法。

您可以在这个 SO 问题中阅读有关此行为的更多信息:Paragraph ignores style because of another nested paragraph