Селектор потомков

luckylad · January 25, 2012

Уважаемые форумчане!

Имеется код.

<html>
	<head>
		<style>
			p p {color: Red;}
		</style>
	</head>
	<body>
		<p>
			<p>
				Текст
			</p>
		</p>		
	</body>
</html>

Почему не срабатывает селектор потомков?

rash · January 25, 2012

Потому что абзац в абзаце быть не может. Браузер закроет первый абзац, прежде чем открыть второй.

luckylad · January 25, 2012

Потому что абзац в абзаце быть не может. Браузер закроет первый абзац, прежде чем открыть второй.

Спасибо!

Логически мне это понятно. Но какая тогда логика в этом примере:

<html>
	<head>
		<style>
			div p h1{color: Red;}
		</style>
	</head>
	<body>
		<div>
			<p>
				<h1>Заголовок</h1>
			</p>
		</div>
	</body>
</html>

Селектор потомков тоже не работает.

lexxcode · January 25, 2012

Ну так h1-h6 тоже нельзя в параграф вставлять...

rash · January 25, 2012

И так тоже нельзя, вложите в абзац строчный элемент (ссылку, span и т. д.)

Или вложите абзац в блочный элемент (div, blockquote…)

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

luckylad · January 26, 2012

Уважаемые,

почему же нельзя в параграф <p> помещать заголовки <h1>-<h6>, ведь и параграф, и заголовок являются блочными элементами, а насколько я знаю, блочные элементы могут включать блочные элементы, строчные элементы и текст, а строчные элементы могут содержать внутри только строчные элементы и текст. Если этот принцип верен, то я ничего не нарушил.

Возможно у меня изначально неверная информация была о том, о чем я написал выше.

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

Great Rash · January 26, 2012

Параграф - это не простой блочный элемент, так же как и таблица. Воспринимайте его как неделимый элемент, в который можно вкладывать только inline-элементы (<span>, <em>, <b>, <a> и т.п.).

luckylad · January 26, 2012

Ясно, спасибо.

А что касается источника описывающих такие нюансы, не подскажите?

Great Rash · January 26, 2012

Легко: http://www.w3.org/TR/html4/struct/text.html#h-9.3.1

The P element represents a paragraph. It cannot contain block-level elements (including P itself).

Элемент P представляет собой параграф. Он не может содержать блочные елементы (включаая P).

luckylad · January 26, 2012

Спасибо!

SelenIT · January 26, 2012

Забудьте о "блочных" и "строчных" элементах, в HTML5 их отменили. Смотрите на смысл элементов и на их content model. Смысл абзаца - деление текста на смысловые фрагменты (грубо - от "красной строки" до "красной строки"), поэтому ничего, кроме текста, в нем содержаться не может. Начало любого блока текста автоматически означает, что это не продолжение старого абзаца, а что-то новое.

Будь моя воля, я бы сделал закрывающий тег для <p>, и так не обязательный, вообще запрещенным. Толку с него немного, а новичков (особенно наслушавшихся XHTML-проповедников) его наличие только сбивает...

А если нужен абстрактный универсальный контейнер, чтобы группировать что угодно - это div.

Sign In

Селектор потомков

Question

Link to comment

Share on other sites

10 answers to this question

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Обсуждения

Important Information