Как убрать подчеркивание из ссылки?

#css #html

#css #HTML

Вопрос:

Я пытаюсь убрать подчеркивание из ссылок на веб-сайте. Я пытался использовать «text-decoration: none;», но это не сработало. Какой синтаксис я сделал неправильно? или есть лучший способ убрать подчеркивание?

 <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>
  

Комментарии:

1. a { text-decoration: none; }

2. @PranavCBalan Я уже пробовал это. Я должен был уточнить это выше.

3. <font> Тег больше официально не поддерживается , лучше поместить свой стиль непосредственно в <a> тег

Ответ №1:

Вы должны использовать

 a {
  text-decoration: none;
}
  

в вашей таблице стилей. text-decoration это то, что добавляет подчеркивание, а этот код удаляет его.


Примечание: Кроме того, вам не следует использовать <font> тег, поскольку он устарел. Вы должны использовать классы.

Комментарии:

1. Я только что избавился от тега <font>, а также изменил стиль на <a>, но это все равно не работает.

2. Есть ли у вас какие-либо другие стили? Потому что установка стиля на a , похоже, работает так, как ожидалось

3. Попробуйте добавить important в конец ( a { text-decoration: none !important;} ). Это дает ему больший приоритет над другими стилями.

4. @fyfles Возможно, на это влияет расширение браузера. Не могли бы вы предоставить ссылку на свой сайт?

5. @VFDan Я забыл упомянуть об этом выше, но важно ли, чтобы мои ссылки были в таблице?

Ответ №2:

Попробуйте это:

 <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>
  

Ответ №3:

проверьте это, надеюсь, это сработает ..[![

 <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

Ответ №4:

Просто перейдите 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:

Причина, по которой в вашем коде все еще присутствует подчеркивание, заключается в том, что тег привязки <a> по умолчанию добавляет оформление подчеркиванием ко всему внутри тега. Таким образом, вам придется применить стиль к букве «a» вместо шрифта — даже если шрифт находится внутри привязки.

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

  

Комментарии:

1. Рекомендуется добавить некоторый вспомогательный текст, описывающий то, что вы иллюстрируете, или точку зрения, которую вы подчеркиваете.