Question

尝试通过使用CSS文档制作水平列表。当我使用内联sttyling时，列表显示为所需，但当我使用CSS选择器时，它没有。我的CSS并没有被覆盖，因为我还在JSBin中测试过。

#footer-list li {
  display: inline;
}

  <ul class="footer-list">
                <li><a href="">1</a></li>
                <li><a href="">2</a></li>
                <li><a href="">3</a></li>
                <li><a href="">4</a></li>
            </ul>

  <ul>
                <li style="display:inline;"><a href="">1</a></li>
                <li style="display:inline;"><a href="">2</a></li>
                <li style="display:inline;"><a href="">3</a></li>
                <li style="display:inline;"><a href="">4</a></li>
            </ul>

Answer 1

你使用了错误的选择器，试试＆＃34; dot＆＃34;而不是＆＃34;哈希＆＃34;

.footer-list li {
  display: inline;
}

Answer 2

正如Dariusz Majchrzak所说，你错误地使用了'＃'而不是'。'

这是一个问题，因为在CSS元素 ID 中标有＃，而类标有。，在这里您引用了一个“footer-list”类

这是

id =“footer-list”

比＃footer-list 的原始代码可以按预期工作。

水平列表内联样式工作但css引用不起作用

2 个答案: