HTML

Perbedaan Element Block dan Inline Pada HTML

perbedaan element block dan inline

Hai semuanya ketemu lagi sama saya, untuk tutorial kali ini saya akan sedikit menjelaskan apa itu perbedaan element block dan inline. Tag dengan tipe block level element, bertujuan untuk membagi halaman HTML menjadi bagian yang terpisah, atau menjadi "Block". Contoh dari blok elemen ini adalah tag paragraf (<p>), list (<ol> atau <ul>), dan heading (<h1> s/d <h6>). Block element akan ditampilkan terpisah dari seluruh tag sebelum dan sesudahnya.

Web browser secara default akan menampilkan blok level elemen secara terpisah seolah-olah dalam sebuah ‘kotak’ dan dimulai pada baris baru (tidak mengikuti tag sebelumnya). Dan biasanya juga memiliki jarak spasi dari tag sebelum dan tag sesudahnya.

Berbeda dengan block level element, tag dengan tipe inline level element akan "Bersatu" dengan tag sebelum dan sesudahnya. Tag ini tidak akan memulai blok atau baris baru namun akan tetap berada di dalam blok tersebut. Tag inline juga tidak akan ditampilkan dengan jarak dari tag sebelum dan sesudahnya. Contoh dari tag inline ini adalah: <span>,<em>, <i>,<strong> dan masih banyak lagi.

Berikut adalah contoh dari Block Element :

<html>
    <head>
        <title> SahabaTekno </title>
    </head>

<div>
   <h1> Ini yang disebut block, karena ada pembungkusnya yaitu div </h1>
</div>

</html>

Berikut adalah contoh dari Inline Element :

<html>
    <head>
        <title> SahabaTekno </title>
    </head>

<div>
   <h1> Ini yang disebut Inline, <span>karena ada kodenya di dalam tag </span> yaitu div </h1>
</div>

</html>

Oke sekian tutorial dari saya, kurang lebihnya mohon maaf semoga jelas dan selamat belajar.

Next : Doctype HTML

About Ray

0 komentar:

Posting Komentar

Diberdayakan oleh Blogger.