Wcześniej przypisywaliśmy deklaracje do tak zwanych selektorów typu czyli najprościej mówiąc znaczników HTML. Takie rozwiązanie niesie za sobą jeden problem, każda nadana deklaracja ma wpływ na wszystkie elementy danego typu jakie znajdują się na stronie. Co jednak kiedy chcemy, żeby jeden albo kilka z pośród paragrafów miały inny kolor? W takiej sytuacji własnie z pomocą przychodzą nam selektory klasy i identyfikatora. Identyfikatory są po to aby pomóc wskazać konkretny niepowtarzalny element na naszej stronie. Może być to tytuł strony, stopka, czy cokolwiek innego co występuje tylko w jednym miejscu. Selektory klas będą pomocne w sytuacji kiedy chcemy mieć “punkt zaczepienia” dla większej grupy elementów.
#identyfikator1 {
color: red;
}
.klasa1 {
color: blue;
}Fragment ten spowoduje, że tekst w znaczniku z przypisanym id o nazwie identyfikator1 będzie czerwony, a wszędzie gdzie dodamy klasę o nazwie klasa1 kolor czcionki zmieni się na niebieski.
Jeżeli jeden element w kodzie HTML będzie miał przypisaną jednocześnie klasę i identyfikator, a obie te selektory będą miały deklaracje stylów dla tego samego atrybutu – tak jak w powyższym przykładzie zostanie przypisana wartość określona za identyfikatorem, ze względu na jego większą szczegółowość.
Nie powinno się zaczynać nazw klas od liczb, ponieważ nie będą one działały we wszystkich przeglądarkach prawidłowo.
