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

На моей странице я поместил некоторые ссылки, под которыми мне не нужна строка, поэтому как удалить это с помощью HTML?

Ответ 1

Встроенная версия:

<a href="http://yoursite.com/" style="text-decoration:none">yoursite</a>

Однако помните, что вы должны вообще отделить содержимое своего сайта (которое HTML), из презентации (которая CSS). Поэтому вы должны избегать встроенных стилей.

См. John answer, чтобы увидеть эквивалентный ответ, используя CSS.

Ответ 2

Это приведет к удалению всех подчеркиваний со всех ссылок:

a {text-decoration: none; }

Если у вас есть определенные ссылки, к которым вы хотите применить это, дайте им имя класса, например nounderline, и сделайте следующее:

a.nounderline {text-decoration: none; }

Это будет применяться только к этим ссылкам и оставить все остальные незатронутыми.

Этот код принадлежит <head> вашего документа или в таблице стилей:

<head>
    <style type="text/css">
        a.nounderline {text-decoration: none; }
    </style>
</head>

И в теле:

<a href="#" class="nounderline">Link</a>

Ответ 3

Я предлагаю использовать: наведите указатель мыши, чтобы избежать подчеркивания, если указатель мыши находится над якорем

a:hover {
   text-decoration:none;
}

Ответ 4

  • Добавьте это в свою внешнюю таблицу стилей (предпочитаемый):

    a {text-decoration:none;}
    
  • Или добавьте это в <head> вашего документа HTML:

    <style type="text/css">
     a {text-decoration:none;}
    </style>
    
  • Или добавить его к самому элементу a (не рекомендуется):

    <!-- Add [ style="text-decoration:none;"] -->
    <a href="http://example.com" style="text-decoration:none;">Text</a>
    

Ответ 5

В другом ответе на все упоминается текстовое оформление. Иногда вы используете тему Wordpress или кого-то еще CSS, где ссылки подчеркиваются другими методами, так что текстовое оформление: ни один не отключит подчеркивание.

Border и box-shadow - два других метода, о которых я знаю, для подчеркивания ссылок. Чтобы отключить их:

border: none;

и

box-shadow: none;

Ответ 6

Ниже приведена не лучшая практика, но иногда может оказаться полезной

Лучше использовать решение, предоставленное Джоном Конде, но иногда использование внешнего CSS невозможно. Таким образом, вы можете добавить следующее в свой HTML-тег:

<a style="text-decoration:none;">My Link</a>

Ответ 7

<style="text-decoration: none">

Вышеприведенный код будет достаточно. Просто вставьте его в ссылку, которую вы хотите удалить.