Клас срещу ID
Cascading Style Sheets (CSS) е език, който описва външния вид и форматирането на документ, написан с помощта на език за маркиране. CSS се използва широко за стилизиране на уеб страници, написани на HTML. CSS позволява да зададете свои собствени селектори за стил в допълнение към прилагането на стилове за HTML елементи. Това се прави с помощта на селектори за ID и клас. Когато се указва стил за отделен уникален елемент, се използва селекторът на ID. Когато се указва стил за група от елементи, се използва селекторът на клас.
Какво е клас?
В CSS селекторът на клас може да се използва за прилагане на ваш собствен стил към група елементи. Селекторът Class се използва за прилагане на специфичен стил към набор от елементи със същия клас. В CSS селекторът на клас се идентифицира с точка (.). Следва пример за селектор на клас, дефиниран в CSS.
.my_class {
цвят: син;
font-weight: получер;
}
HTML може да препраща към класа, дефиниран в CSS, като използва класа на атрибута, както е показано по-долу.
Това е моето форматиране
Това отново е моето форматиране
Както е показано по-горе, един и същ клас може да се използва за множество елементи и един елемент може да използва множество класове. Когато се използват множество класове в един и същ елемент, класовете се вмъкват в атрибута на класа, разделени с интервал, както е показано по-долу.
Това е моето форматиране с помощта на два класа
Какво е ID?
В CSS ID селекторът може да се използва за прилагане на ваш собствен стил към отделен уникален елемент. В CSS ID селекторът се идентифицира с хеш (). Следва пример за ID селектор, дефиниран в CSS.
my_ID {
цвят: червен;
text-align:right;
}
HTML може да препраща към селектора на ID, дефиниран в CSS, като използва идентификатора на атрибута, както е показано по-долу.
Това е моето форматиране от селектор на ID
IDs са уникални. Следователно всеки елемент може да има само един идентификатор и всяка страница може да има само един елемент с този конкретен идентификатор. Идентификаторите имат важна характеристика, която може да се използва с браузър. Ако URL адресът на страницата съдържа хеш стойност (напр. https://myweb.commy_id), браузърът ще се опита автоматично да намери елемента с ID „my_id“и ще превърти уеб страницата, за да покаже този елемент. Това е една от причините страницата да има един елемент с този конкретен идентификатор, така че браузърът да може да намери този елемент.
Каква е разликата между Class и ID?
Въпреки че и селекторът на клас, и селекторът на ID могат да се използват за прилагане на ваш собствен стил към елементи в уеб страница, те имат някои важни разлики. Селекторът на клас може да се използва за прилагане на ваш собствен стил към група от елементи, докато селекторът на ID се използва за прилагане на стил към единичен, уникален елемент. Когато използвате идентификатори, всеки елемент може да има само един идентификатор и всяка страница може да има само един елемент с този конкретен идентификатор, но класът може да се използва за множество елементи и един елемент може да използва множество класове. Освен това ID може да се използва за автоматично превъртане на страница, за да се покаже елементът с този ID, но това не е възможно със селектора на клас.
