6.1 псевдоклассы, анимации, единицы измерения
псевдоклассы
псевдоклассы определяют состояние элементов, которое изменяется с помощью действий пользователя. вот так выглядит их запись:
Селектор:Псевдокласс { Описание правил стиля }
:hover
стиль применяется при наведении на элемент. например для ссылки у нас установлен синий цвет по умолчанию, когда юзер наведет на ссылку курсор, то он станет красным.
:visited
данный псевдокласс применяется к посещённым ссылкам. обычно такая ссылка меняет свой цвет по умолчанию на фиолетовый, но с помощью стилей цвет и другие параметры можно задать самостоятельно
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Псевдоклассы</title>
<style>
a:hover{
color: red; /* Цвет ссылок при наведении куросром */
}
a:visited {
color: #606; /* Цвет посещенных ссылок */
}
</style>
</head>
<body>
<a href="#">Ссылка</a> |
</body>
</html>
background
сделать картинку задним фоном и по центру 👇
background: center url('xxx');
transition/анимация
отличная статья 👇😀 https://developer.mozilla.org/ru/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions
читаем про единицы измерения
https://learn.javascript.ru/css-units
крутецкие ресурсы

Last updated
Was this helpful?