Горизонтальная линия в html: как сделать и настроить

Горизонтальная линия в html — простейший элемент, который создается с помощью одного одинарного тега. И все же я решил написать о нем отдельную заметку.

Но я думаю, что она будет очень короткой, потому что писать особо не о чем. В html горизонтальная линия создается с помощью одинарного тега hr. Вот так она выглядит по умолчанию:

Все мы, вебмастера и разработчики, постоянно работаем с сайтами. Хотел бы вам порекомендовать площадки, которыми пользуюсь сам:
  1. Reg.ru - здесь регистрирую и продлеваю доменные имена, очень надежная компания!
  2. HostIQ - хостинг премиум качества.
  3. Ihor - более бюджетный, но тоже очень качественный хостинг-провайдер.
  4. Telderi.ru - единственная надежная биржа в рунете, на которой можно купить готовые сайты с доходом!

Основная цель этой горизонтальной линии, как я понимаю, это разделение разных частей текста. Например, разные части статьи можно разделить с ее помощью. В принципе, у этой линии есть какие-то атрибуты, но для более правильной настройки я вам рекомендую изменять ее параметры через css. Это очень легко — используем для этого селектор hr.

Горизонтальной линии в css можно задать все то же, что и обычным элементам. Например, высоту (по умолчанию 1 пиксель, через css можно прописать любую, хоть 900 пикселей) и цвет линии. Можно указать сплошной, а можно и градиент.

Также я подозреваю, что вы можете легко задать картинку какой-нибудь декоративной линии как background-image, и таким образом использовать ее в качестве разделителя. В общем, все возможности по оформлению горизонтальных линий лежат в css, хотя их на самом деле очень немного.

Вообще, hr — это простейший html-элемент. Простая линия. Ну что тут еще сказать? smile

Понравилась статья? Поделиться с друзьями:
Комментариев: 1
  1. Владимир

    Привет. Название кнопки «читать все» поменять надо на «читать всё» или «далее»

Добавить комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: