Як зробити горизонтальну смужку CSS?

Горизонтальна лінія робиться за допомогою властивості border-bottom, яка зазвичай застосовується до елемента <div>. Ця властивість додає лінію знизу заданої товщини та стилю (приклад 1). Щоб не «псувати» все, використовуємо клас line, і вже для класу вказуємо властивість border-bottom.

Як додати смужку CSS?

Отже, якщо нам потрібно розмістити вертикальну або горизонтальну лінію зверху або з лівого боку елемента, то потрібно використовувати псевдоелемент :before. Якщо ж лінія має бути праворуч або знизу, то ми маємо використовувати псевдоелемент: after.

Як зробити смужку HTML CSS?

За допомогою тегу <hr> можна намалювати горизонтальну лінію, вигляд якої залежить від атрибутів, що використовуються, а також браузера. Тег відноситься до блокових елементів, тому лінія завжди починається з нового рядка, а після неї всі елементи відображаються на наступному рядку.

WebReference
Як зробити горизонтальну лінію? | Рецепти WebReference

Як зробити смужку за допомогою: before,: after?

А навіщо такі вимоги? В обох псевдоелементів підтримка браузерами гірша, ніж просто "border-bottom".

@w3lifer: У моїй практиці все ще дуже часто пишуться ТЗ, які потребують підтримки від ІЕ7. Якщо у вас інакше, то я вам заздрю ​​=)

1 відповідь 1

@w3lifer це SCSS, зручна річ, habrahabr.ru/post/140612 . Парситься потім у CSS, конструкції виходять зручнішими та приємнішими оку, + можна використовувати калькуляцію та змінні

Подібні

Підписатися на стрічку

Для підписки на стрічку скопіюйте та вставте це посилання у вашу програму для читання RSS.

Дизайн сайту/логотип © 2023 Stack Exchange Inc; користувальницькі матеріали ліцензовані відповідно до CC BY-SA. rev 2023.10.2.43654

Натискаючи «Прийняти всі файли cookie» ви погоджуєтеся, що Stack Exchange може зберігати файли cookie на вашому пристрої та розкривати інформацію відповідно до нашої Політики щодо файлів cookie.