Красная строка (redline) в типографике – это отрезок текста или другого элемента, который выделен отдельной линией или углублением.

Чтобы создать красную строку в CSS, можно использовать псевдоэлемент ::before у элемента, к которому он относится.

.redline::before {
    content: "";
    display: block;
    height: 2px;
    width: 100%;
    background-color: red;
    margin-bottom: 10px;
}

В этом примере мы использовали класс .redline для элемента, к которому необходимо добавить красную строку.

Псевдоэлемент ::before создает пустой контейнер перед содержимым элемента, к которому он относится.

Свойство display: block; указывает на то, что псевдоэлемент должен отображаться как блочный элемент на странице.

height: 2px; устанавливает высоту красной строки.

width: 100%; делает красную строку шириной 100% относительно элемента, к которому она относится.

background-color: red; устанавливает цвет красной строки.

margin-bottom: 10px; устанавливает отступ снизу для содержимого элемента, чтобы избежать накладывания его на красную строку.

Теперь элементы с классом .redline на вашей странице будут иметь красную строку перед текстом. Убедитесь, что элемент, к которому вы добавляете красную строку, имеет свойство position: relative;, чтобы псевдоэлемент располагался относительно его.