Question

我已经阅读了多个具有相同问题的主题，并尝试按照所有说明进行操作，但似乎无法从以下<ul> <li>段中删除项目符号。

<div id="mobile-contact-bar-outer">
<ul>
<li><a data-rel="external" href="tel:+18885551212"><span class="fa-stack fa-3x"><i class="fa-fw fas fa-phone"></i>
<span class="screen-reader-text">Phone Number for calling</span></span></a></li>
<li><a data-rel="external" href="mailto:name@email.com"><span class="fa-stack fa-3x"><i class="fa-fw far fa-envelope"></i><span class="screen-reader-text">Email Address</span></span></a></li>
</ul>
</div>

我都添加了：

div#mobile-contact-bar-outer {
    list-style-type: none!important;
}

div#mobile-contact-bar {
    list-style-type: none!important;
}

均无效。我想念什么？网站上没有缓存。

Answer 1

将list-style: none添加到UL标签。 MDN参考

ul {
    list-style: none
}

Answer 2

执行以下操作，您必须直接编辑ul标签，因为list-style-type在div上无效

div#mobile-contact-bar-outer ul {
  list-style-type: none;
}

div#mobile-contact-bar ul{
  list-style-type: none;
}

<div id="mobile-contact-bar-outer">
  <ul>
    <li><a data-rel="external" href="tel:+18885551212"><span class="fa-stack fa-3x"><i class="fa-fw fas fa-phone"></i>
<span class="screen-reader-text">Phone Number for calling</span></span></a></li>
    <li><a data-rel="external" href="mailto:name@email.com"><span class="fa-stack fa-3x"><i class="fa-fw far fa-envelope"></i><span class="screen-reader-text">Email Address</span></span></a></li>
  </ul>
</div>

Answer 3

您可以像

一样向您的元素添加一个类。

<ul class="newclass">

并添加您列表样式类型：

都没有添加到该元素

ul.newclass{
list-style-type: none
}

这个新类将允许对该单个ul元素进行更多控制

或将类添加到您的div

div#mobile-contact-bar-outer ul{
    list-style-type: none;
}

现在不需要重要标签。

如何从ul中删除子弹？

3 个答案: