文字装饰：无 不适用于链接？

Question

text-decoration: none; 不工作...我的浏览器是 Chrome，代码如下：

.hotbar li {
  float: right;
  display: inline-block;
  color: red;
  margin: 0 50px;
  text-decoration: none;
}

<nav class="hotbar">
  <ul>
    <li> <a href="http://127.0.0.1:64310/about.html" target="_blank">About</a></li>
    <li> <a href="http://127.0.0.1:64310/platforms.html" target="_blank">Platforms</a></li>
    <li> <a href="http://127.0.0.1:64310/contact.html" target="_blank">Contact</a></li>
  </ul>
</nav>

Answer 1

您需要从锚点中删除文本装饰。因此，将您的选择器更改为 .hotbar li a

.hotbar li a {
  float: right;
  display: inline-block;
  color: red;
  margin: 0 50px;
  text-decoration: none;
}

<nav class="hotbar">
  <ul>
    <li> <a href="http://127.0.0.1:64310/about.html" target="_blank">About
                        </a></li>
    <li> <a href="http://127.0.0.1:64310/platforms.html" target="_blank">Platforms
                        </a></li>
    <li> <a href="http://127.0.0.1:64310/contact.html" target="_blank">Contact
                        </a></li>
  </ul>
</nav>