У HTML ми можемо легко додати горизонтальну лінію в документ, використовуючи такі різні способи:
- Використання тегу Html
- Використання внутрішнього CSS
Використання Html
Якщо ми хочемо додати горизонтальну лінію в документ Html за допомогою Html тег , тоді нам потрібно виконати кроки, наведені нижче. Використовуючи ці кроки, ми можемо легко додати рядок:
Крок 1: По-перше, нам потрібно ввести код Html у будь-якому текстовому редакторі або відкрити існуючий файл Html у текстовому редакторі, у який ми хочемо додати горизонтальну лінію.
Add the Line using Html tags This page helps you to understand how to add the line in Html document. And, this section helps you to understand how to add the line using the Html tags.
крок 2: Тепер помістіть курсор у точку, де ми хочемо додати рядок у документі Html. І тоді ми повинні використовувати
тег Html у цій точці.
<hr>
крок 3: Тепер ми повинні додати атрибути
тег, який визначає розмір, колір і ширину лінії. Отже, ми повинні ввести атрибут розміру, ширини та кольору всередині
тег.
<hr>
крок 4: І тоді ми повинні вказати значення цих атрибутів.
<hr>
крок 5: І, нарешті, ми повинні зберегти код Html, а потім запустити файл у браузері.
Add the Line using Html tags This page helps you to understand how to add the line in Html document. <hr> And, this section helps you to understand how to add the line using the Html tag.Перевірте зараз
Результати наведеного вище коду Html показано на наступному знімку екрана:
Використання внутрішнього CSS
Якщо ми хочемо додати горизонтальну лінію в Html-документ за допомогою внутрішньої таблиці стилів, ми повинні виконати кроки, наведені нижче. Використовуючи ці кроки, ми можемо легко додати рядок:
Крок 1: По-перше, нам потрібно ввести код Html у будь-якому текстовому редакторі або відкрити існуючий файл Html у текстовому редакторі, у який ми хочемо додати горизонтальну лінію.
Add the Line using Internal CSS. This page helps you to understand how to add the line in Html document. And, this section helps you to understand how to add the line using the Internal Cascading Style Sheet.
крок 2: Тепер ми повинні розмістити курсор одразу після закриття тегу title у головний тег документа Html, а потім визначте стилі всередині тег, як показано в наступному блоці. Потім ми повинні ввести CSS-тег hr для стилізації горизонтальної лінії.
Add the Line using Internal CSS. hr { } крок 3: Тепер нам потрібно визначити атрибути CSS-тегу hr. Отже, ми визначимо різні атрибути в наступному блоці:
Add the Line using Internal CSS. hr { width: 80%; height: 2px; background-color: pink; margin-bottom: 7px; margin-right: auto; margin-left: auto; margin-top: 9px; border-width: 4px; border-color: blue; } крок 4: Тепер ми повинні ввести
тег у тілі документа Html, щоб показати горизонтальну лінію на веб-сторінці. І, нарешті, ми повинні зберегти файл Html, а потім запустити файл в Інтернет-браузері.
Add the Line using Internal CSS. hr { width: 80%; height: 2px; background-color: pink; margin-bottom: 7px; margin-right: auto; margin-left: auto; margin-top: 9px; border-width: 4px; border-color: blue; } This page helps you to understand how to add the line in Html document. <hr> And, this section helps you to understand how to add the line using the Internal Cascading Style Sheet. Перевірте зараз Результати наведеного вище коду Html показано на наступному знімку екрана:
