Вы можете создать галочку в CSS, используя псевдоэлементы ::before
и ::after
и стили CSS для создания формы.
Например, следующий код создаст галочку размером 20х20 пикселей:
HTML:
<div class="check"></div>
CSS:
.check {
width: 20px;
height: 20px;
position: relative;
border: 1px solid black;
}
.check::before, .check::after {
content: "";
position: absolute;
width: 100%;
height: 2px;
background-color: black;
top: 50%;
}
.check::before {
transform: rotate(-45deg);
left: 3px;
}
.check::after {
transform: rotate(45deg);
right: 3px;
}
Здесь мы создаем пустые псевдоэлементы ::before
и ::after
и задаем им необходимые свойства для создания линий галочки. Затем мы используем transform: rotate()
для поворота псевдоэлементов на 45 градусов в разные стороны и позиционируем их с помощью свойств left
и right
.
Вы можете изменять размер, цвет и другие свойства, чтобы создать нужный вам вид галочки.