文字装饰不影响超链接

Text Decoration Not Affecting Hyperlink

本文关键字：影响 超链接 文字      更新时间：2023-09-26

我有一个部分在我的网站上有一个链接，但它有一个下划线，所以我尝试了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>

您有一个div元素，其中包含一个a，其中包含一个p。DIV有一个带有文本装饰的类，但是您需要将它应用于a元素，因此您可以使用.readnews a{ text-deciration:none; }另一方面，在HTML中，不应该在内联元素(a标记)中添加BLOCK元素(P标记)，因此从技术上讲，这是错误的。无论如何，它会工作，但你应用文本装饰:none到P，而你应该把它添加到a…A标签总是比其他元素更"重要"。

如果你想保留你的HTML元素，你应该在p里面添加A，所以:Div> p> a然后给A标签添加样式

<a href="themes.goodlayers2.com/musicclub/blog-full-with-right-sidebar/" class="readall"> <p> Read All News </p></a>

可以保留p元素

给周围的锚标记class readall而不是段落。我还是把p元素去掉吧

相关文章：