Question

我正在尝试从网站上的链接中删除下划线。我尝试使用“文本装饰：无；”但这是行不通的。我做错了什么语法？还是有一种更好的方法来删除下划线？

<head>
  <style>
    font {
      color: #ff9600;
      text-decoration: none;
    }
  </style>
</head>

<body>
  <a href="index.html">
    <font>Home</font>
  </a>
  <a href="watch.html">     
    <font>Watch</font>
  </a>
  <a href="info.html">
    <font>Info</font>
  </a>
</body>

Answer 1

您应该使用

a {
  text-decoration: none;
}

在您的样式表中。 text-decoration是添加下划线的内容，该代码将其删除。

侧面注意：此外，您不应该像it is obsolete那样使用<font>标记。您应该使用类。

Answer 2

您的代码仍带有下划线的原因是，默认情况下，Anchor标记将下划线修饰添加到标记内的所有内容上。因此，即使字体位于锚点内，也必须将样式应用于“ a”而不是字体。

<style>
    a {
       text-decoration: none;
     }
</style>

Answer 3

尝试一下：

<head>
  <style>
    font {
      color: #ff9600;
      text-decoration: none;
    }
    a {
      text-decoration: none;
    }
  </style>
</head>
<body>
  <a href="index.html">
    <font>Home</font>
  </a>
  <a href="watch.html">     
    <font>Watch</font>
  </a>
  <a href="info.html">
    <font>Info</font>
  </a>
</body>

Answer 4

检查出来，希望它能工作。.[！[

<head>
<style>
     font {
          color: #ff9600;
          }
    
    a{
    
    text-decoration: none;
    }
    </style>
    </head>
    <body>
      <a href="index.html">
        <font>Home</font>
      </a>
      <a href="watch.html">     
        <font>Watch</font>
      </a>
      <a href="info.html">
        <font>Info</font>
      </a>
    </body>

] 1] 1

Answer 5

只需将text-decoration: none;从font CSS移到anchor tag a CSS。将解决您的问题。谢谢

a {
  text-decoration: none;
}

a {
  text-decoration: none;
}

font {
  color: #ff9600;
}

<a href="index.html">
  <font>Home</font>
</a>
<a href="watch.html">     
  <font>Watch</font>
</a>
<a href="info.html">
  <font>Info</font>
</a>

如何从链接中删除下划线？

5 个答案: