2013-03-07 3 views
0

У меня возникают проблемы с созданием стиля, который наследует цвет и размер, когда ссылка находится внутри тегов h1 и span. Они должны вести себя одинаково, если они находятся внутри td's. Я ввел нужный результат в именах ссылок.Условный шрифт, размер и цвет Условный шрифт

JS Fiddle:

http://jsfiddle.net/lasseedsvik/ym7M7/9/

Стиль

* { 
    color: #000;  
    font-family: Times; 
    font-size: 14px; 
} 

a { 
    color: red; 
} 

h1 
{ 
    font-family: arial, helvetica; 
    font-size: 27px; 
    color: green; 
} 

Html

<div id="container"> 
    Default text color 
    <br /> 
    <br /> 
    <a href="#">Red link . default font</a> 
    <br /> 
    <h1><a href="#">Green link - Arial 27px</a></h1> 
    <br /> 
    <span style="font-size: 18px"><a href="#">Red link - 18px default font</a></span> 
</div> 
+0

'h1 a {font-size: inherit; color: inherit; } '? – BoltClock

ответ

1

Попробуйте

h1 a, span a{ 
    font-size:inherit; 
    font-family:inherit; 
    color:inherit; 
} 
1

Используйте CSS inherit ключевое слово:

h1 a, 
span a { 
    color: inherit; 
    font: inherit; 
} 

Demo up here.

1

Ключевое слово inherit можно запросить для наследования, но оно не поддерживается IE 7. Вы получаете лучшее покрытие браузера, явно объявляя, что хотите, например.

h1, h1 a 
{ 
    font-family: arial, helvetica; 
    font-size: 27px; 
    color: green; 
} 

установить свойство как на прямом содержании h1 и любой a элемента, содержащемся в h1.

Смежные вопросы