Книга: HTML, XHTML и CSS на 100%
ID-селекторы
Разделы на этой странице:
ID-селекторы
Атрибут ID языка документа позволяет назначать идентификатор одному экземпляру элемента в дереве HTML-документа. В CSS ID-селекторы сопоставляются экземпляру элемента в зависимости от его идентификатора. В CSS ID-селектор содержит символ #, непосредственно за которым следует значение атрибута ID.
Например, следующий ID-селектор сопоставляется элементу H1, значение атрибута ID которого равно chapter7:
h1#chapter7 { text-align: center }
В листинге 7.6 правило стиля сопоставляется элементу, у которого значение атрибута ID равно z98y. Иначе говоря, это правило будет сопоставляться элементу P.
Листинг 7.6. ID-селекторы
<head>
<title>Глава 7</title>
<style type="text/css">
*#z98y { letter-spacing: 0.3em }
</style>
</head>
<body>
<p абзаца</p>
</body>
Однако в примере из листинга 7.7 это правило стиля будет сопоставляться только элементу H1, значение атрибута ID которого равно z98y. В этом примере данное правило не сопоставляется элементу P.
Листинг 7.7. ID-селекторы
<head>
<title>Глава 7</TITLE>
<style type="text/css">
h1#z98y { letter-spacing: 0.5em }
</style>
</head>
<body>
<p абзаца</p>
</body>
Надо отметить, что ID-селекторы имеют более высокий приоритет, чем селекторы атрибутов. Например, в HTML-документе селектор #p123 более специфичен, чем [ID=p123].