наследование свойств css

en5er · November 9, 2011

Доброго времени суток всем!

У меня такой вопрос, возможно его было бы правильнее задать в теме HTML, но все же. Как наследуются свойства тэгов (селекоров) в css? Например у меня такой код html:

<html>
<head>
<title>Any's</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<a href="http://google.ru">
<h1>Моя таблица стилей
</h1>
</a><br>
<h2>Текст 2</h2><br>
<h1 class="any">Это ссылка на что то .ру</h1>
</body>
</html>

и если в css прописать для класса any отдельные свойства, отличные от свойств селектора h1, то те св-ва которые не указаны в классе, будут наследоваться от свойств селектора h1..Например подчеркивание, шрифт будут браться от h1 если не указал их в классе.

вот css:

body {
	  background-image: url("img/tile.jpg");
	  Background-attachment: fixed;
	}
h1    {
color: white;
background-color: magenta;
font-family: "Century Gothic";
text-align: center;
text-decoration: overline underline;
	} 
.any  {
color: yellow;
background-color: blue;
font-family: "Tahoma";
text-align: left;
	    }
h2    {
font-family: "arial";
color: white;
background-color: #3784ed;
text-align: center;
text-decoration: overline underline;
background-image: url("img/patt.jpg");
	}

и вот свойство text-decoration: overline underline; не указано в классе any но все равно при открытии странички это свойство наблюдается (подчеркивание сверху и снизу).

собственно сам вопрос - почему класс наследует свойства родительского селектора?разве он не обособлен? Ведь должны отображаться только те свойства которые прописаны классу? Разве нет?

В итоге проблему решил задав первому тегу <h1> тоже отдельный класс и прописав свойства и значения класса в css. Это правильное решение? Или есть более легкое и правильное? Спасибо!

fragilewelldone · November 9, 2011

Боюсь ошибиться но класс не наследует никаких свойств, просто в некоторых случаях работают свойства селектора h1, а если значение этих свойств поменять в классе .any, то они оказываются "важнее" чем свойства простого селектора h1.

А наследование происходит только при вложении одного определенного элемента в другое.

Например элемент <td></td> наследует свойства элемента <table></table>

Если что не так-поправьте. :rolleyes:

Edited November 9, 2011 by fragilewelldone

SelenIT · November 9, 2011

разве он не обособлен? Ведь должны отображаться только те свойства которые прописаны классу? Разве нет?

Нет, потому что CSS - каскадные таблицы стилей, один элемент может попадать в "сферу действия" нескольких селекторов, и заданные для них свойства применяются к нему по каскаду.

Justnewone · November 9, 2011

Я понимаю отвечающих, настолько элементарный вопрос, что хочется ответить нестандартно.

SelenIT · November 9, 2011

Это у автора темы в вопросе терминология нестандартная . Под "родительским" селектором понимается аналогичный селектор меньшей специфичности (тег против класса), а суть вопроса именно о каскаде. Впрочем, обе ссылки пригодятся, заодно и с терминологией, надеюсь, прояснится

Justnewone · November 9, 2011

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

en5er · November 10, 2011

Justnewone до чегож жизнь доводит, что сразу хочется ответить нестандартно?) Спокойнее, берегите себя, нервы, здоровее будете. И Спасибо за ссылку, возможно с терминологией не в порядке, исправлюсь.Спасибо всем, все понял и разобрался с вопросом благодаря вам!

Sign In

наследование свойств css

Question

en5er

Link to comment

Share on other sites

6 answers to this question

Recommended Posts

fragilewelldone

Link to comment

Share on other sites

SelenIT

Link to comment

Share on other sites

Justnewone

Link to comment

Share on other sites

SelenIT

Link to comment

Share on other sites

Justnewone

Link to comment

Share on other sites

en5er

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information