DEV Community

Muhammad Iqbal
Muhammad Iqbal

Posted on

Apa Perbedaan antara <div> dan <span> dalam HTML?

HTML

Dalam html, div dan span adalah element HTML yang sering digunakan untuk mengatur konten.

meskipun seringkali digunakan dengan tujuan yang serupa tetapi terdapat perbedaan penting dalam cara penggunaan dan efek yang dihasilkan.

A. div

div adalah elemen blok dalam HTML yang digunakan untuk membuat blok konten yang terpisah atau area yang memenuhi lebar penuh dari kontainer yang mengelilinginya.

Biasanya, <div> digunakan untuk mengelompokkan elemen-elemen lain secara bersama-sama dalam satu blok.

Ini sering dipakai untuk membuat layout atau sekelompok elemen menjadi bagian dari satu unit yang terpisah.

Contoh penggunaan <div>:

<div>
<h1>Judul</h1>
<p>Ini adalah paragraf pertama.</p>
<p>Ini adalah paragraf kedua.</p>
</div>

Hasil:

div

B. <span>

<span> adalah elemen inline yang digunakan untuk menerapkan style atau memformat bagian-bagian kecil dari teks dalam sebuah elemen.

Biasanya, digunakan untuk mengubah gaya, seperti warna atau gaya huruf, dari sebagian teks tertentu dalam sebuah paragraf atau elemen lain yang serupa.

Contoh penggunaan <span>

<p>Ini adalah sebuah <span style="color: blue; border:1px solid red;">teks yang diberi warna biru</span> dalam sebuah paragraf.</p>

Hasil:

span

Perbedaan Utama:

<div> adalah elemen blok yang membuat blok konten terpisah dan mengambil lebar penuh dari kontainer.

<span> adalah elemen inline yang memungkinkan modifikasi gaya pada sebagian kecil dari teks dalam suatu elemen.

Jadi, sementara <div> digunakan untuk mengelompokkan elemen sebagai blok, <span> digunakan untuk memodifikasi bagian-bagian kecil dari teks atau konten.

SEMOGA BERMANFAAT

Top comments (0)