CSS селектор id
Поддержка браузерами
Описание
CSS селектор id
позволяет применить стиль к определённому элементу на странице, в котором указан необходимый идентификатор. Определение селектора id
в CSS коде начинается с символа решётки "#
", за которым следует имя идентификатора:
#myid { color: blue; }
Чтобы использовать селектор id
, нужно указать, к какому элементу на странице вы хотите его применить, для этого надо добавить атрибут id
в открывающем теге и указать в качестве значения имя нужного идентификатора. Ставить решётку перед именем идентификатора в HTML коде (в значении атрибута id
) не нужно.
Примечание: идентификаторы не должны повторяться в рамках одного документа, т.е. определенный id
может быть использован на странице только один раз с тегом, для которого он предназначен. Если вы хотите применять стиль более чем к одну элементу, следует использовать селектор class
.
Селектор id
имеет некоторые особенности:
- В имени идентификатора разрешается использовать только буквы, числа, дефис и знак подчеркивания
- Имя идентификатора всегда должно начинаться с буквы
- Имена идентификаторов чувствительны к регистру символов, например: #Menu и #menu это два разных идентификатора
Пример:
<!doctype html> <html> <head> <meta charset="utf-8"> <title>Пример</title> <style> #myname {color:red;} </style> </head> <body> <h1>Добро пожаловать!</h1> <div> <p id="myname">Меня зовут Арни.</p> <p>Я играю в онлайн игры.</p> </div> <p>Моего кота тоже зовут Арни.</p> </body> </html>
Результат данного примера:
Добро пожаловать!
Меня зовут Арни.
Я играю в онлайн игры.
Моего кота тоже зовут Арни.