Когда тег <a>не наследует атрибут цвета родительского тега? - PullRequest
Новая
       24

Когда тег <a>не наследует атрибут цвета родительского тега?

26 голосов
/ 17 июля 2009

Вот мой код: 

.blue {
    color:#6E99E1;
    font-size:9px;
}
<span class="blue">::<a href="/equipment_new.php">CLICK HERE</a>:: to view our New Equipment inventory. <br /><br /></span>

Я как-то вызвал что-то, что помешало тегу <a> унаследовать цвет родительского <span>.

Ответы [ 8 ]

45 голосов
/ 18 июля 2009

Просто дополнение к другим ответам, если вы хотите свои <a> теги для наследования цвета от их родителя, вы можете использовать 

a {color: inherit; }
32 голосов
/ 17 июля 2009

По умолчанию тег привязки не наследует такие атрибуты, как цвет, если присутствует атрибут href.

Проверьте разницу между этими двумя на странице (я не знаю, как сделать так, чтобы это отображалось в записи): 

<span style=color:green><a href="t">test</a></span>


<span style=color:green><a>test</a></span>

Следующая ссылка на w3 c:

http://www.w3.org/TR/html401/struct/links.html#h-12.2

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

.....

Обычно содержимое А не предоставляется каким-либо особым образом, когда А определяет только привязку.

8 голосов
/ 19 июля 2009

Это ответ на вопрос, а также ответ на ответ Кевина и его комментарии.

Теги привязки do наследуют цвет, связаны или нет. Единственная причина, по которой они этого не делают на практике, заключается в том, что их цвет уже установлен в таблице стилей браузера по умолчанию. То же самое можно сказать и о подчеркивании ссылки (которую, я полагаю, вы не заметили, потому что вы на самом деле хотите или уже изменили ее самостоятельно).

В Firefox вы можете увидеть это в Firebug, если переключите «Показать пользовательский CSS-код» (или вы можете взглянуть на внутренние таблицы стилей Firefox . Вы можете увидеть настройки браузера по умолчанию в Webkit Web Inspector. а также Opera Dragonfly. Я не думаю, что вы можете в IE.

Я не знаю ни одного сайта, на котором есть обзор всех настроек браузера по умолчанию. «Информативная» CSS2 таблица стилей HTML4 , а также таблица стилей сброса YUI была бы хорошей отправной точкой, но ни один из них не упоминает какие-либо (ссылочные) цвета (таблица стилей HTML4 не упоминает подчеркивание ).

Чтобы узнать, какие свойства наследуются в целом, вы можете использовать таблицу индексов справочных свойств CSS2 (см. Столбец «Унаследовано?»). SitePoint также упоминает об этом в справочнике CSS .

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

.blue a:link {
    color: inherit;
}

Вы можете установить его для разных псевдоклассов отдельно (например, :visited, :hover и :active) или для тега a в целом.

Однако IE6 и IE7 не поддерживают ключевое слово inherit , поэтому, если вы хотите их также поддерживать, вам придется явно установить цвет.

5 голосов
/ 17 июля 2009

Я думаю, a не наследует цвет по умолчанию. (конечно, это всегда работало на моих сайтах). Почему бы не изменить 

.blue {
    color:#6E99E1;
    font-size:9px;
}

до 

.blue, .blue a{
    color:#6E99E1;
    font-size:9px;
}
3 голосов
/ 17 июля 2009

Firebug покажет вам, какие именно правила стиля применяются к каким элементам. Это идеально подходит для этого.

(Возможность не-CSS: есть ли у вас link/alink/vlink атрибуты в вашем <body> теге?)

Редактировать : Да, глупый я, остальные правы - <a href> не наследует цвет. Но Firebug по-прежнему является хорошим инструментом для решения подобных проблем (даже если я нет. 8 -)

1 голос
/ 17 июля 2009

В дополнение к firebug (который должен быть вашим первым портом захода), панель инструментов разработчика IE также скажет вам, откуда взят данный стиль, на всякий случай IE - шок, ужас - должен быть другим.

0 голосов
/ 06 декабря 2011

Вы, вероятно, видите раскраску а: посетил. Попробуйте это: 

.blue, .blue:link, .blue:visited {
  color:#6E99E1;
  font-size:9px;
}
0 голосов
/ 17 июля 2009

Вам нужно явно установить цвет ссылок, чтобы переопределить синий цвет по умолчанию.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...