Как сделать горизонтальную линию в css

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

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc; /* цвет линии */
  margin: 1em 0;
  padding: 0;
}

Вы также можете настроить цвет, ширину, стиль и другие свойства линии по своему усмотрению. Если вы хотите разместить линию на определенной позиции, вы также можете использовать свойство position для его позиционирования.

Кроме тега hr, вы также можете создавать линии с помощью других элементов HTML, таких как divsection и т.д., и стилизовать их точно так же, как и hr. Например:

.line {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc; /* цвет линии */
  margin: 1em 0;
  padding: 0;
}
<div class="line"></div>

В этом примере мы создаем линию используя тег div, а не hr.

реклама

Качественный хостинг сайтов

реклама

Получите консультацию нашего маркетолога

Изучит ваш проект, подберет подходящие услуги и тарифы

Получите бесплатный аудит

Наш специалист сделает базовый аудит вашего проекта и предложит персональные предложения.

Закажите услугу Как сделать горизонтальную линию в css

Наш специалист свяжется с вами в ближайшее время и уточнит детали