Удалить упрямый подчеркивание из ссылки

StackOverflow https://stackoverflow.com/questions/2789703

  •  04-10-2019
  •  | 
  •  

Вопрос

Я пытаюсь показать ссылку на белом, без подчеркивания. Цвет текста отображается правильно как белый, но синий подчеркивает упрямо упорно. Я старался text-decoration: none; а также text-decoration: none !important; В CSS для удаления подчеркивания ссылки. Не работал. 

.boxhead .otherPage {
  color: #FFFFFF;
  text-decoration: none;
}
<div class="boxhead">
  <h2>
    <span class="thisPage">Current Page</span>
    <a href="myLink"><span class="otherPage">Different Page</span></a>
  </h2>
</div>

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

Это было полезно?

Решение

Как я ожидал, вы не применяете text-decoration: none; к якоре (.boxhead a) но в элемент охвата (.boxhead).

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

.boxhead a {
    color: #FFFFFF;
    text-decoration: none;
}

Другие советы

Якорной тег (ссылка) также имеет псевдо-классы, такие как посещенные, зависящие, ссылка и активные. Убедитесь, что ваш стиль применяется к вопросу о состоянии (ы) и что никакие другие стили не являются противоречивыми.

Например:

a:hover, a:visited, a:link, a:active
{
    text-decoration: none;
}

Видеть W3.org. Для получения дополнительной информации о Действие пользователя Pseudo-Classes: Hover: Active и: Фокус.

text-decoration: none !important должен удалить это .. ты уверен, что нет border-bottom: 1px solid скрывался? (Следить за вычисленным стилем в Firebug / F12 в IE)

Просто добавьте этот атрибут в свой якорный тег

style="text-decoration:none;"

Пример:

<a href="page.html"  style="text-decoration:none;"></a>

Или используйте путь CSS. 

.classname a {
    color: #FFFFFF;
    text-decoration: none;
}

Вы пропустили text-decoration:none для Якорная тег. Отказ Таким образом, код должен быть следующим.

.boxhead a {
    text-decoration: none;
}
<div class="boxhead">
    <h2>
        <span class="thisPage">Current Page</span>
        <a href="myLink"><span class="otherPage">Different Page</span></a>
    </h2>
</div>

Более стандартные свойства для текстового оформления

enter image description here

Иногда вы видите, это коробка тень, а не подчеркивается текст.

Попробуйте это (используя любые подходящие для вас CSS):

a:hover, a:visited, a:link, a:active {

    text-decoration: none!important;

    -webkit-box-shadow: none!important;
    box-shadow: none!important;
}

Не видение страницы, трудно спекулировать.

Но это звучит мне, как у вас, возможно, border-bottom: 1px solid blue; применяются. Возможно добавить border: none;. text-decoration: none !important Это верно, возможно, у вас есть другой стиль, который все еще переоценивает, что CSS, хотя.

Это где используя Firefox Web Developer панель инструментов Потрясающе, вы можете редактировать CSS прямо там и посмотреть, работают ли все, по крайней мере, для Firefox. Это под CSS > Edit CSS.

Как правило, если ваша «подчеркивание» не является тем же цветом, что и ваш текст [и «цвет:» не переопределяют встроенные]. Он не исходит из «Text-Decoration:»

Не забудьте взять границу от своих классов псевдо!

a, a:link, a:visited, a:active, a:hover {border:0!important;}

Этот фрагмент предполагает его на якоре, переожал на обертку соответственно ... и использовать специфику вместо «! Важный» после того, как вы отслеживаете корневую причину.

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

a {
   text-decoration:none;
}

Это удалит подчеркивание из каждой ссылки на вашу страницу!

Если text-decoration: none или border: 0 Не работает, попробуйте применять встроенный стиль в вашем HTML.

Просто используйте свойство

border:0;

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

Ни один из ответов не работал для меня. В моем случае был стандарт 

a:-webkit-any-link {
text-decoration: underline;

в моем коде. В основном, какая она есть, цвет текста идет синее, и ссылка остается все, что она есть.

Поэтому я добавил код в конце заголовка, как это: 

<head>
  </style>
    a:-webkit-any-link {
      text-decoration: none;
    }
  </style>
</head>

И проблема больше нет.

Вот пример для управления ASP.NET WebForms LinkButton:

 <asp:LinkButton ID="lbmmr1" runat="server" ForeColor="Blue" />

Код позади:

 lbmmr1.Attributes.Add("style", "text-decoration: none;")

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

Вы можете использовать этот код

.boxhead h2 a{text-decoration: none;}

ИЛИ

.boxhead a{text-decoration: none !important;}

ИЛИ

a{text-decoration: none !important;}

Поместите следующий HTML-код перед<BODY> ярлык:

<STYLE>A {text-decoration: none;} </STYLE>

В моем случае у меня плохо образуется HTML. Ссылка была в пределах <u> тег, а не <ul> ярлык.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top