Різниця між класом та ідентифікатором

Клас проти ідентифікатора

Каскадні таблиці стилів (CSS) - це мова, яка описує вигляд та форматування документа, написаного за допомогою мови розмітки. CSS широко використовується для створення веб-сторінок, написаних HTML. CSS дозволяє вказувати власні вибрані стилі на додаток до застосування стилів для елементів HTML. Це робиться за допомогою селекторів ідентифікаторів та класів. При визначенні стилю для одного унікального елемента використовується селектор ідентифікаторів. При визначенні стилю для групи елементів використовується селектор класів.

Що таке клас?

У CSS селектор класів можна використовувати для застосування власного стилю до групи елементів. Селектор класів використовується для застосування певного стилю до набору елементів з тим самим класом. У CSS селектор класів ідентифікується повної зупинки (.). Далі наводиться приклад вибору класу, визначеного в CSS.

.мій клас

колір: синій;

шрифт: жирний шрифт;

HTML може посилатися на клас, визначений у CSS, використовуючи клас атрибутів, як показано нижче.

Це моє форматування

Це знову моє форматування

Як показано вище, один клас може бути використаний для декількох елементів, а один елемент може використовувати кілька класів. Коли в одному елементі використовуються кілька класів, класи вставляються в атрибут класу, розділений пробілом, як показано нижче.

Це моє форматування за допомогою двох класів

Що таке ідентифікатор?

У CSS селектор ідентифікаторів можна використовувати для застосування власного стилю до одного унікального елемента. У CSS селектор ідентифікації ідентифікується хешем (#). Далі наводиться приклад селектора ідентифікаторів, визначеного в CSS.

#my_ID

колір: червоний;

вирівнювання тексту: справа;

HTML може посилатися на селектор ідентифікаторів, визначений у CSS, використовуючи ідентифікатор атрибута, як показано нижче.

Це моє форматування форми вибору ідентифікатора

Ідентифікатори унікальні. Тому кожен елемент може мати лише один ідентифікатор, і кожна сторінка може мати лише один елемент із цим конкретним ідентифікатором. Ідентифікатори мають важливу характеристику, яку можна використовувати в браузері. Якщо URL-адреса сторінки містить значення хешу (наприклад, http: //myweb.com#my_id), браузер спробує автоматично знайти елемент з ідентифікатором «my_id» та прокручує веб-сторінку, щоб відобразити цей елемент. Це одна з причин того, що на сторінці має бути один елемент із певним ідентифікатором, щоб браузер міг знайти цей елемент.

Яка різниця між класом та ідентифікатором?

Незважаючи на те, що і селектор класів, і селектор ідентифікаторів можна використовувати для застосування власного стилю до елементів веб-сторінки, вони мають деякі важливі відмінності. Селектор класів можна використовувати для застосування власного стилю до групи елементів, тоді як селектор ідентифікаторів використовується для застосування стилю до одного, унікального елемента. При використанні ідентифікаторів кожен елемент може мати лише один ідентифікатор, і кожна сторінка може мати лише один елемент із цим конкретним ідентифікатором, але клас може бути використаний для декількох елементів, а один елемент може використовувати декілька класів. Крім того, ідентифікатор може використовуватися для автоматичного прокручування сторінки для відображення елемента з цим ідентифікатором, але це не можливо за допомогою селектора класів.