Belajar HTML : Element Blok dan Inline (7) - Suka Code

Belajar HTML : Element Blok dan Inline - Pada artikel sebelum nya saya sudah menjelaskan Menuliskan Komentar Pada Halaman Web. Kali ini kita akan mempelajari dua jenis element dalam HTML.

• Dalam HTML, ada dua jenis element, yaitu Element Blok dan Element Inline.

Element Blok

Elemen blok selalu berawal dari baris baru dan menghabiskan seluruh lebar yang disediakan. Contoh dari elemen blok adalah :

• <div>

• <h1> - <h6>

• <p>

• <form>

Element Inline

Elemen Inline tidak secara otomatis membuat baris baru, melainkan melanjutkan baris sebelumnya. Sehingga elemen inline ini hanya membutuhkan lebar seperlunya. Sesuai dengan konten dari elemen tersebut. Contoh elemen inline adalah :

• <span>

• <a>

• <img>

Contoh Penggunaan.

Ketik code dibawah ini dan save.

<div style="background-color:black; color:white; padding:20px;">
 <h2>Ini contoh elemen blok</h2>
 <p>Setiap elemen yang berbeda dimulai dengan baris baru.</p> 
</div> 
<h1>Ini 
 <span style="color:red">contoh elemen inline</span>.
 <i>Elemen inline tidak membuat baris baru untuk masing-masing elemen</i>
 melainkan hanya melanjutkan elemen sebelumnya
</h1>

Lalu sobat buka di browser maka hasil nya seperti ini :

Sekian tutorial Belajar HTML : Element Blok dan Inline. Semoga bermanfaat buat teman-teman semua.

Muhammad Ridwan

Suka Code Blog adalah website dengan kumpulan konten seputar Game Development, Web Programming, Android Programming, Windows Programming, dan lain-lain.

Bagikan Artikel ini