javascript - 文本修饰不影响超链接

Question

我的网站上有一个部分有一个链接，但它有一个下划线，所以我尝试了 text-decoration: none; 但无济于事。有人可以帮我解决这个问题吗？

代码:

<div class="content2">
  <div class="twitterfeed">
    <h3>Twitter Feed</h3>
  </div>
  <div class="recent">
    <h3 class="text3">Recent News<span class="slash">   /   </span><span class="text4">Get updates from us!</span></h3>
  </div>
  <div class="readnews">
    <a href="themes.goodlayers2.com/musicclub/blog-full-with-right-sidebar/"> <p class="readall"> Read All News </p></a>
  </div>
</div>
<style type="text/css">

.content2 {
  background: #191919;
  padding-top: 10px;
  padding-left: 25px;
  padding-right: 20px;
}

.twitterfeed {
  float: left;
  padding-left: 140px;
  color: white;
  font-size: 30px;
  font-family: Didot, Georgia, sans-serif;
}

.recent {
  display: inline-block;
  padding-left: 230px;
}

.readnews {
  float: right;
  color: white;
  padding-right: 457px;
  text-decoration: none;
}

.text3 {
  color: white;
  font-family: "Goudy Old Style", Optima, sans-serif;
  font-size: 35px;
  margin-bottom: 0;
}

.text4 {
  font-size: 30px;
  color: #6CB9D9;
}

.readall {
  text-decoration: none;
  color: white;
}
</style>

Answer 1

你有一个 DIV 元素，其中包含一个 A，其中包含一个 P。DIV 有一个带有文本修饰的类，但您需要将它应用于 A 元素，因此您可以使用 .readnews a{ text-deciration:none; 另一方面，在 HTML 中，您不应在 INLINE 元素(A 标签)内添加 BLOCK 元素(P 标签)，因此这在技术上是错误的。无论如何，它会起作用，但是你正在将 text-decoration:none 应用到 P，而你应该将它添加到 A ... A 标签总是比任何其他元素更“重要”(谈论 CSS ).

如果你想保留你的 HTML 元素，你应该在 P 中添加 A，所以:分区 > P > A然后将样式添加到 A 标签。