Бесплатный курс по Java: от основ до продвинутого уровня
Что такое классы в CSS
А что, если мы хотим применить определённый набор CSS-свойств вообще к любому элементу на странице, не указывая конкретный тег, например h1 { ... } или p { ... }?
Для этого используются классы.
Классы определяются в css файлике. У класса есть имя и оно может быть любым, его придумывает программист. Этому имени сопоставляется определённый набор CSS-свойств.
/*создаем класс с именем imagePropsClass.
Теперь свойства в этом классе можно применить
к любому тегу на html странице*/
.imagePropsClass {
width: 600px; /*ширина html тега*/
height: 350px; /*высота html тега*/
}
/*ниже из прошлых уроков*/
h1, h2 {
font-weight: 600;
font-family: ‘Brush Script MT’, cursive;
}
h3 {
font-weight: 600;
font-family: ‘Courier New’, monospace;
}
img {
border-style: dashed;
border-color: red;
border-radius: 15px;
}
Всё, что нужно, чтобы применить этот набор свойств к конкретному элементу на html странице, это указать это имя класса в аттрибуте class этого элемента
Page tab text
Давайте откроем только что написанную страницу в браузере.
Как видим, свойства класса imagePropsClass были успешно применены к картинке. Ее ширина стала 600px, а высота 250px.
Как уже было сказано, класс можно применить вообще к любому тегу, то есть не только к img. В этом его смысл.