Тег <span>

Тег <span> в HTML використовується для групування і стилізації частини тексту або вбудованих елементів на веб-сторінці. Він не має ніякого візуального впливу сам по собі, але дозволяє застосовувати стилі або маніпулювати частинами контенту за допомогою CSS чи JavaScript.

Тег <span> є вбудованим (inline) елементом, що означає, що він не починає новий рядок і не має візуальних відступів. Цей тег зазвичай використовується для того, щоб застосувати стилі або додати функціональність до частини тексту або інших елементів без зміни їхньої структури.

Наприклад, тег <span> може використовуватися для виділення певного слова або фрагмента тексту в абзаці або заголовку.

Атрибути

Специфічні атрибути

Тег <span> не має специфічних атрибутів.

Глобальні атрибути

• class — використовується для визначення стилів, які застосовуються до елемента за допомогою CSS. Це дозволяє групувати елементи для застосування однакових стилів. Наприклад:

<span class="highlight">Цей текст виділений.</span>

• id — дає можливість створювати унікальний ідентифікатор елемента для використання в JavaScript або CSS. Наприклад:

<span id="important-text">Це важливий текст.</span>

• style — дозволяє додавати інлайн-стилі до елемента. Наприклад:

<span style="color: red;">Цей текст буде червоним.</span>

• lang — вказує мову вмісту елемента. Наприклад:

<span lang="en">This is an English text.</span>

• title — надає додаткову інформацію про елемент, яка відображається при наведенні курсора миші. Наприклад:

<span title="Важлива інформація">Наведіть курсор на цей текст.</span>

• dir — вказує напрямок тексту, наприклад, “ltr” (зліва направо) або “rtl” (справа наліво). Наприклад:

<span dir="rtl">Текст на арабській мові.</span>

Приклад використання

<p>Це звичайний абзац з <span class="highlight" style="color: red;">виділеним текстом</span> всередині.</p>

Додаткові моменти

• Тег <span> не має візуальних змін, тому він є дуже корисним для стилізації або маніпуляцій із частинами контенту без зміни їх структури.
• <span> — це вбудований елемент, що означає, що він не розриває потік документа і не створює нових рядків.
• Зазвичай тег <span> застосовується разом із CSS або JavaScript для змінення вигляду або поведінки вмісту.
• Якщо потрібно виділити цілу частину документа (наприклад, абзац чи блок), слід використовувати блочні елементи, такі як <div>.