Загрузить PDF Загрузить PDF

Устаревший метод подчеркивания в HTML заключается в использовании тегов <u></u>, но теперь используется современный метод на основе CSS. Подчеркивание считается плохим способом привлечь внимание к тексту, потому что подчеркнутый текст легко спутать со ссылкой.

Метод 1
Метод 1 из 2:

Современный метод

Загрузить PDF
  1. В настоящее время тег <u> не применяется для подчеркивания текста.
    • Если добавить это свойство, вам не придется менять код в будущем, когда старые теги выйдут из обращения.
  2. Используйте тег <span>, чтобы подчеркнуть определенный фрагмент текста. Введите открывающий тег вместе со свойством «text-decoration» перед текстом, который нужно подчеркнуть. В конце текста введите закрывающий тег </span>. [1]
     < 
     span 
     style 
     = 
     "text-decoration: underline;" 
     > 
    Этот текст будет подчеркнут. </ 
     span 
     > 
    
  3. Также это можно сделать с помощью таблицы стилей CSS. Например, чтобы подчеркнуть все заголовки уровня 3, добавьте следующий код в раздел «style»:
     < 
     html 
     > 
     < 
     head 
     > 
     < 
     style 
     > 
     h3 
     { 
     text-decoration 
     : 
     underline 
     ; 
     } 
     </ 
     style 
     > 
     </ 
     head 
     > 
     < 
     body 
     > 
     < 
     h3 
     > 
    Этот заголовок будет подчеркнут </ 
     h3 
     > 
     </ 
     body 
     > 
     </ 
     html 
     > 
    
  4. В таблице стилей или разделе <style> можно создать классы, чтобы вызвать их позже. Классу можно присвоить любое имя.
     < 
     html 
     > 
     < 
     head 
     > 
     < 
     style 
     > 
     . 
     underline 
     { 
     text-decoration 
     : 
     underline 
     ; 
     } 
     </ 
     style 
     > 
     </ 
     head 
     > 
     < 
     body 
     > 
    Используйте этот класс для < 
     div 
     class 
     = 
     "underline" 
     > 
    быстрого подчеркивания </ 
     div 
     > 
    различных < 
     div 
     class 
     = 
     "underline" 
     > 
    элементов </ 
     div 
     > 
     </ 
     body 
     > 
     </ 
     html 
     > 
    
  5. Рекомендуем избегать подчеркивания, чтобы не запутать пользователей. Лучше применить тег <em>, чтобы выделить текст курсивом. Используйте CSS, чтобы добавить к этому тегу другие параметры стиля.
     < 
     html 
     > 
     < 
     head 
     > 
     < 
     style 
     > 
     em 
     { 
     color 
     : 
     red 
     ; 
     } 
     </ 
     style 
     > 
     </ 
     head 
     > 
     < 
     body 
     > 
    Все, что находится в элементе «em», будет выделено < 
     em 
     > 
    курсивом (по умолчанию), а также окрашено в красный цвет </ 
     em 
     > 
    благодаря дополнительным параметрам стиля. </ 
     body 
     > 
     </ 
     html 
     > 
    
    Реклама
Метод 2
Метод 2 из 2:

Устаревший метод

Загрузить PDF
  1. Они устарели — это означает, что эти теги все еще работают, но ими стараются не пользоваться или не рекомендуют применять. Это связано с тем, что HTML не предназначен для настройки стиля контента. Тег <u> все еще работает, но должен представлять текст, отличный от другого текста, например, слов с ошибками или китайских имен собственных.
  2. Используйте теги <u></u>, чтобы подчеркивать элементы (только для демонстрации). Практически нет ни одного случая, когда необходимо использовать эти теги. Возможно, вам придется редактировать старый сайт, поэтому лучше быть в курсе, что представляют собой указанные теги.
     < 
     html 
     > 
     < 
     body 
     > 
    Старый HTML-тег < 
     u 
     > 
    позволял быстро подчеркивать элементы </ 
     u 
     > 
    , но если затрагивались другие элементы стиля, все становилось хаотичным. Поэтому сейчас для подчеркивания используют CSS-элемент «text-decoration». </ 
     body 
     > 
     </ 
     html 
     > 
    
    Реклама

Советы

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

Об этой статье

Эту страницу просматривали 42 714 раз.

Была ли эта статья полезной?

Реклама