Block Element dan Inline Element pada HTML #3


Pada kesempatan sebelumnya saya membuat postingan tentang struktur dasar pada HTML, dan pada kesempatan kali ini saya akan membuat postingan, seperti yang kalian tahu dari judulnya, yaitu macam-macam block level element pada HTML. Block level Element ini berbeda dengan Inline Element ya. Oke simak aja penjelasannya langsung.

BLOCK ELEMENT PADA HTML
Pertama, tujuan tag Block level element pada HTML ini adalah untuk membuat bagian yang terpisah. Contohnya seperti tag <p>, <h1> s.d <h6>, <ul> atau <ol>. Masing-masing tag tersebut membuat tulisan menjadi saling terpisah, atau membuat bagiannya masing-masing.



Contoh coding :
Block level pada HTML terdapat 6 tingkatan, yaitu <h1> sampai <h6>, contoh :
<html>
 <head>
  <title> Blok Level Element </title>
 </head>
<body>
  <h3>Heading three</h3>
  <h4>Heading four</h4>
  <h5>Heading five</h5>  
  <p>Selamat Datang di muhamad-aslam.blogspot.com</p>  
  <ul>
    <li>Java</li>
    <li>PHP</li>
  </ul>
</body>
</html>

Dan jika dijalankan, Berikut preview Outputnya :


Seperti yang kalian lihat, pada masing-masing tag otomatis membuat baris baru, padahal tidak dibuat tag <br> untuk membuat baris baru, dan itu dia yang dimaksud membuat bagian masing-masing pada blok element.

INLINE ELEMENT PADA HTML
Sedangan inline element itu tidak membuat bagian masing-masing pada elementnya, contohnya seperti tag <i>,<b>,<strong>,<em>.

Contoh coding :
<html>
 <head>
  <title> Blok Level Element </title>
 </head>
<body>
  <b>Selamat Datang di muhamad-aslam.blogspot.com</b>
  <em>Selamat Datang di muhamad-aslam.blogspot.com</em>
  <i>Selamat Datang di muhamad-aslam.blogspot.com</i>
  <strong>Selamat Datang di muhamad-aslam.blogspot.com</strong>
</body>
</html>

Dan jika dijalankan, Berikut preview Outputnya :
Dan itu untuk dulu Block Element dan Inline Element pada HTML. Oke sekian dulu untuk postingan ini, Semoga bermanfaat.

2 Responses to "Block Element dan Inline Element pada HTML #3"

  1. untuk penambahan javascript penempatan dan scriptnya bagaimana ya? terima kasih

    ReplyDelete
    Replies
    1. Kalo penambahan javascript bisa didalam tag head, dan juga bisa di bagian paling bawah sblm tutup body.

      Delete

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel