Як підкреслити текст в HTML

Автор: Clyde Lopez
Дата Створення: 19 Липня 2021
Дата Оновлення: 1 Липня 2024
Anonim
html теги для форматирования текста. html5 работа с текстом. HTML5 для начинающих. Урок#5
Відеоролик: html теги для форматирования текста. html5 работа с текстом. HTML5 для начинающих. Урок#5

Зміст

Застарілий метод підкреслення в HTML полягає в використанні тегів u> / u>, але тепер використовується сучасний метод на основі CSS. Підкреслення вважається поганим способом привернути увагу до тексту, тому що підкреслений текст легко сплутати з посиланням.

кроки

Метод 1 з 2: Сучасний метод

  1. 1 Використовуйте властивість «text-decoration» в CSS. В даний час тег u> не застосовується для підкреслення тексту.
    • Якщо додати цю властивість, вам не доведеться міняти код в майбутньому, коли старі теги вийдуть з обігу.
  2. 2 Використовуйте тег span>, щоб підкреслити певний фрагмент тексту. Введіть відкриває тег разом з властивістю «text-decoration» перед текстом, який потрібно підкреслити. В кінці тексту введіть закриває тег / span>.

    span style = "text-decoration: underline;"> Цей текст буде підкреслений. / span>

  3. 3 Вкажіть HTML-елементи в розділі style>, щоб спростити підкреслення. Також це можна зробити за допомогою таблиці стилів CSS. Наприклад, щоб підкреслити всі заголовки рівня 3, додайте наступний код в розділ «style»:

    html> head> style> h3 {text-decoration: underline; } / Style> / head> body> h3> Цей заголовок буде підкреслений / h3> / body> / html>

  4. 4 Створіть клас CSS, щоб швидко підкреслювати текст. У таблиці стилів або розділі style> можна створити класи, щоб викликати їх пізніше. Класу можна привласнити будь-яке ім'я.

    html> head> style> .underline {text-decoration: underline; } / Style> / head> body> Використовуйте цей клас для div> швидкого підкреслення / div> різних div> елементів / div> / body> / html>

  5. 5 Подумайте про інші способи виділення тексту. Рекомендуємо уникати підкреслення, щоб не заплутати користувачів. Краще застосувати тег em>, щоб виділити текст курсивом. Використовуйте CSS, щоб додати до цього тегу інші параметри стилю.

    html> head> style> em {color: red; } / Style> / head> body> Все, що знаходиться в елементі «em», буде виділено em> курсивом (за замовчуванням), а також забарвлене в червоний колір / em> завдяки додатковим параметрам стилю. / Body> / html>

Метод 2 з 2: Застарілий метод

  1. 1 Уникайте використання старих тегів u> / u>. Вони застаріли - це означає, що ці теги все ще працюють, але ними намагаються не користуватися або не рекомендують застосовувати. Це пов'язано з тим, що HTML не призначений для настройки стилю контенту. Тег u> все ще працює, але повинен представляти текст, відмінний від іншого тексту, наприклад, слів з помилками або китайських назв.
  2. 2 Використовуйте теги u> / u>, щоб підкреслювати елементи (тільки для демонстрації). Практично немає жодного випадку, коли необхідно використовувати ці теги. Можливо, вам доведеться редагувати старий сайт, тому краще бути в курсі, що представляють собою зазначені теги.

    html> body> Старий HTML-тег u> дозволяв швидко підкреслювати елементи / u>, але якщо порушувалися інші елементи стилю, все ставало хаотичним. Тому зараз для підкреслення використовують CSS-елемент «text-decoration». / Body> / html>

Поради

  • Практично завжди є кращий спосіб виділити контент на веб-сторінці, ніж підкреслення. Підкреслення може заплутати користувачів. Подумайте про те, як виділити текст за допомогою CSS.