Для создания трех полосок в CSS можно использовать псевдоэлементы ::before и ::after. Эти элементы позволяют добавлять содержимое перед или после существующего элемента без необходимости вносить изменения в HTML-код.
Например, чтобы создать три вертикальных полоски, можно использовать следующий CSS-код:
div::before, div::after {
content: "";
display: block;
height: 20px;
width: 3px;
background-color: black;
}
div::before {
margin-bottom: 10px;
}
div::after {
margin-top: 10px;
}
Этот код создает два псевдоэлемента для элемента div: ::before и ::after. Оба элемента имеют содержимое, установленное с помощью свойства content, и блочный тип отображения, установленный с помощью свойства display. Ширина и высота полосок задаются с помощью свойств height и width, а цвет фона — черный, установленный с помощью свойства background-color.
Полоски отступают друг от друга на 10 пикселей с помощью свойства margin-top и margin-bottom в псевдоэлементах ::before и ::after соответственно.
Также можно использовать другие свойства CSS, чтобы изменить ширину, цвет и расположение полосок в зависимости от ваших потребностей.