Deskripsi
Penjelasan HTML

HTML <span> element merupakan element inline (elemen yang tidak membentuk garis baru) yang digunakan untuk mengelompokkan beberapa element yang dimaksudkan untuk memudahkan dalam pemberian style (dengan CSS). Misalnya, memudahkan untuk men-style element ketika digunakan bersama dengan global attributes, contohnya: attribute class, lang atau dir.

<span> element hanya digunakan pada sebuah konten yang tidak merepresentasikan apapun, yang tidak memiliki arti semantic (semantic meaning).


Global Attributes
Atribut Secara Global (Keseluruhan)

<span> tag mencakup global attributes, yang artinya tag tersebut dapat disisipkan semua attributes yang termasuk dalam global attributes yang secara umum berlaku untuk semua HTML tags.

Event Attributes
Atribut event (Peristiwa)

<span> tag mencakup event attributes, yang artinya attribute tersebut dijalankan ketika ada interaksi dari user atau dalam suatu peristiwa (kejadian). Contoh: menjalankan script (JavaScript) ketika halaman web pada jendela browser hendak ditutup, dan lain sebagainya.

Example
Contoh HTML <span> element

Contoh 1

Contoh <span> didalam <p> element.

<p>Teks didalam paragraf, <span>Teks didalam span</span></p>
Contoh 2

Contoh <span> dengan CSS style.

<p>Aku cinta kamu = <span lang="en">I love you</span></p>
<p>Aku rindu kamu = <span lang="en">I miss you</span></p>
[lang="en"] {
  color: blue;
}

Contoh diatas misalnya, jika kita ingin memberi style warna biru hanya untuk terjemahan berbahasa inggris (lang="en") saja. Artinya, setiap element yang memiliki attribute lang="en" akan memiliki teks berwarna biru.

Hasil dari kedua contoh diatas dapat dilihat pada demo editor dibawah ini:

Contoh Lengkap
Demo dengan Source Code Editor

Demo Editor
Demo HTML <span>
Code Editor