Класс против ID
Каскадные таблицы стилей (CSS) - это язык, описывающий внешний вид и форматирование документа, написанного с использованием языка разметки. CSS широко используется для оформления веб-страниц, написанных на HTML. CSS позволяет указывать собственные селекторы стилей в дополнение к применению стилей для элементов HTML. Это делается с помощью селекторов ID и класса. При указании стиля для одного уникального элемента используется селектор ID. При задании стиля для группы элементов используется селектор класса.
Что такое класс?
В CSS селектор класса можно использовать для применения собственного стиля к группе элементов. Селектор класса используется для применения определенного стиля к набору элементов одного класса. В CSS селектор класса обозначается точкой (.). Ниже приведен пример селектора класса, определенного в CSS.
.мой_класс {
цвет: синий;
начертание: полужирный;
}
HTML может ссылаться на класс, определенный в CSS, используя класс атрибута, как показано ниже.
Это мое форматирование
Это снова мое форматирование
Как показано выше, один и тот же класс может использоваться для нескольких элементов, а один элемент может использовать несколько классов. Когда в одном элементе используется несколько классов, классы вставляются в атрибут класса, разделенный пробелом, как показано ниже.
Это мое форматирование с использованием двух классов
Что такое идентификатор?
В CSS селектор ID можно использовать для применения собственного стиля к одному уникальному элементу. В CSS селектор ID обозначается решеткой (). Ниже приведен пример селектора ID, определенного в CSS.
my_ID {
цвет: красный;
text-align:right;
}
HTML может ссылаться на селектор ID, определенный в CSS, используя идентификатор атрибута, как показано ниже.
Это мое форматирование из селектора ID
ID уникальны. Поэтому каждый элемент может иметь только один идентификатор, и каждая страница может иметь только один элемент с этим конкретным идентификатором. Идентификаторы имеют важную характеристику, которую можно использовать в браузере. Если URL-адрес страницы содержит хеш-значение (например, https://myweb.commy_id), браузер попытается автоматически найти элемент с идентификатором «my_id» и прокрутить веб-страницу, чтобы отобразить этот элемент. Это одна из причин, по которой на странице должен быть один элемент с этим конкретным идентификатором, чтобы браузер мог найти этот элемент.
В чем разница между Class и ID?
Несмотря на то, что и селектор класса, и селектор идентификатора можно использовать для применения собственного стиля к элементам на веб-странице, они имеют некоторые важные отличия. Селектор класса можно использовать для применения собственного стиля к группе элементов, а селектор идентификатора - для применения стиля к одному уникальному элементу. При использовании идентификаторов каждый элемент может иметь только один идентификатор, и каждая страница может иметь только один элемент с этим конкретным идентификатором, но класс может использоваться для нескольких элементов, а один элемент может использовать несколько классов. Кроме того, идентификатор можно использовать для автоматической прокрутки страницы для отображения элемента с этим идентификатором, но это невозможно с помощью селектора класса.
