Тег диапазона HTML

Опубликовано: 27 Августа, 2022

HTML-элемент span представляет собой универсальный встроенный контейнер для встроенных элементов и контента. Он используется для группировки элементов в целях стилизации (с использованием атрибутов class или id). Лучший способ использовать его, когда нет другого семантического элемента.

Тег span является парным тегом, что означает, что он имеет как открывающий (<), так и закрывающий (>) теги, и обязательно закрывать тег. Тег span используется для группировки встроенных элементов, и сам по себе этот тег не вносит никаких визуальных изменений. span очень похож на тег div, но div — это тег уровня блока , а span — встроенный тег .

Синтаксис:

<span class="">Some Text</span> 

Атрибут: этот тег принимает все глобальные атрибуты и атрибуты событий.

Пример 1: В этом примере мы просто используем тег span со стилем в HTML.

Выход:

Пример 2. В этом примере предположим, что мы хотим написать три раза GeeksforGeeks в трех строках жирным шрифтом, курсивом, подчеркиванием, зеленым цветом и font-family = courier new, поэтому нам нужно использовать много HTML-тегов, таких как <b>, <i>, <u>, <font> каждый раз в каждой строке, и мы хотим внести изменения, чтобы изменить каждый тег.

Выход:

Пример 3. В этом примере с помощью тега <span> мы можем уменьшить код и атрибуты HTML. См. приведенный ниже пример, который будет отображать тот же результат, что и приведенный выше пример с использованием тега <span>, применяя CSS в теге span.

Выход:

Пример 4: Как мы знаем, span — это встроенный тег, он занимает столько места, сколько требуется, и оставляет место для других элементов. Все элементы с четырьмя пролетами будут отображаться в одной строке, потому что каждый тег занимает только необходимое пространство, а остальное пространство свободно для других элементов.

Выход:

Пример 5: Тег span может использоваться для установки цвета/цвета фона как части текста. В приведенном ниже примере внутри абзаца трижды тег span с другим стилем.

Выход:

Пример 6: Управление JavaScript с помощью тега span. В приведенном ниже примере мы добавляем тег span внутри абзаца с идентификатором = «demo». Мы можем изменить его текст, применив javascript. В этом примере GFG изменится на «GeeksforGeeks» после нажатия кнопки .

Выход:

Разница между тегом Div и тегом span : тег div и span — это два общих тега при создании страниц с использованием HTML, которые выполняют на них разные функции, в то время как тег div является элементом уровня блока, а span — встроенным элементом. Тег div создает разрыв строки и по умолчанию создает разделение между текстом, который идет после начала тега, и до тех пор, пока тег не заканчивается на </div>. Тег div создает отдельные блоки или контейнеры для всех элементов внутри этого тега, таких как текст, изображения, абзацы.

Поддерживаемые браузеры:

  • Гугл Хром
  • Интернет-проводник
  • Край 12 и выше
  • Фаерфокс 1 и выше
  • Опера
  • Сафари

HTML является основой веб-страниц, используется для разработки веб-страниц путем структурирования веб-сайтов и веб-приложений. Вы можете изучить HTML с нуля, следуя этому руководству по HTML и примерам HTML.