A. PENDAHULUAN
Masih dengan hal yang sama , kita masih akan membahas soal HTML, tapi kali ini kita akan memahami dan membuat tentang Block Element dan Inline Element. Apa itu Block Element dan Inline Element? Apa kegunaanya? akan saya bahas di blog kali ini
B. PENGERTIAN
Pada dasarnya, seluruh tag dalam HTML dibedakan menjadi 2 jenis: tag bertipe block element dan tag dengan tipe inline element. Perbedaan keduanya terletak dalam cara web browser menampilkan tag ini.
Di dalam HTML, seluruh text atau ‘isi’ halaman web harus berada di dalam atau diantara tag pembuka dan penutup HTML. Tag-tag di dalam HTML bisa dibagi menjadi 2 bagian, yakni tag berjenis block, dan tag berjenis inline.
C. MAKSUD DAN TUJUAN
Dapat memahami perbedaan dari block element dan inline element
D. PEMBAHASAN
Kita akan membuat tag element block dan inline agar dapat mengetahui perbedaan dari keduanya.
*Block Element
Tag dengan tipe block level element, bertujuan untuk membagi halaman HTML menjadi bagian yang terpisah, atau menjadi ‘blok’. 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.
Berikut adalah contoh tag <p>, <h2>, dan <ol> di dalam HTML:
1. ini adalah script yang bisa kalian ketik untuk percobaan kali ini agar dapat mempraktekkanya juga
<!DOCTYPE html>
<html>
<head>
<title>Tag Block Element dan Inline Element</title>
</head>
<body>
<h2>Membuat Tag Block Element dan Inline Element</h2>
<p>Tag p dan h1 adalah tag dengan tipe blok</p>
<p>Keduanya akan dimulai di baris baru</p>
<ul>
<li>Tag li juga merupakan blok elemen</li>
<li>dan juga akan berjarak dari tag p sebelumnya</li>
</ul>
</body>
</html>
hasilnya :
<head>
<title>Membuat Tag Block Element dan Inline Element</title>
</head>
<body>
<p><strong>Saya sedang belajar Inline Element HTML </strong>
<i>di sini</i>
<b>Tag i dan em adalah tag dengan tipe inline</b>
<em>Keduanya tidak dimulai di baris baru</em></p>
</body>
</html>
hasilnya :
E. MASALAH YANG DI TEMUKAN
Kebanyakan orang tidak terlalu mengetahui perbedaan dari keduanya
F. KESIMPULAN
*Block Element : Tag dengan tipe block level element, bertujuan untuk membagi halaman HTML menjadi bagian yang terpisah, atau menjadi ‘blok’.
*Inline Block : tag dengan tipe inline level element akan ‘menyatu’ dengan tag sebelum dan sesudahnya. Tag ini tidak akan memulai blok atau baris baru namun akan tetap berada di dalam blok tersebut.
G. REFERENSI
https://www.duniailkom.com/tutorial-text-html-perbedaan-block-element-dengan-inline-element-tag-html/
Masih dengan hal yang sama , kita masih akan membahas soal HTML, tapi kali ini kita akan memahami dan membuat tentang Block Element dan Inline Element. Apa itu Block Element dan Inline Element? Apa kegunaanya? akan saya bahas di blog kali ini
B. PENGERTIAN
Pada dasarnya, seluruh tag dalam HTML dibedakan menjadi 2 jenis: tag bertipe block element dan tag dengan tipe inline element. Perbedaan keduanya terletak dalam cara web browser menampilkan tag ini.
Di dalam HTML, seluruh text atau ‘isi’ halaman web harus berada di dalam atau diantara tag pembuka dan penutup HTML. Tag-tag di dalam HTML bisa dibagi menjadi 2 bagian, yakni tag berjenis block, dan tag berjenis inline.
C. MAKSUD DAN TUJUAN
Dapat memahami perbedaan dari block element dan inline element
D. PEMBAHASAN
Kita akan membuat tag element block dan inline agar dapat mengetahui perbedaan dari keduanya.
*Block Element
Tag dengan tipe block level element, bertujuan untuk membagi halaman HTML menjadi bagian yang terpisah, atau menjadi ‘blok’. 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.
Berikut adalah contoh tag <p>, <h2>, dan <ol> di dalam HTML:
1. ini adalah script yang bisa kalian ketik untuk percobaan kali ini agar dapat mempraktekkanya juga
<!DOCTYPE html>
<html>
<head>
<title>Tag Block Element dan Inline Element</title>
</head>
<body>
<h2>Membuat Tag Block Element dan Inline Element</h2>
<p>Tag p dan h1 adalah tag dengan tipe blok</p>
<p>Keduanya akan dimulai di baris baru</p>
<ul>
<li>Tag li juga merupakan blok elemen</li>
<li>dan juga akan berjarak dari tag p sebelumnya</li>
</ul>
</body>
</html>
hasilnya :
Dari contoh tersebut terlihat bahwa masing-masing tag akan ditampilkan di baris baru dan berjarak dari tag sebelumnya.
*Inline Element
tag dengan tipe inline level element akan ‘menyatu’
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: <em>, <i>,<strong>dan<b>.
contoh Scriptnya :
<!DOCTYPE html>
<html><head>
<title>Membuat Tag Block Element dan Inline Element</title>
</head>
<body>
<p><strong>Saya sedang belajar Inline Element HTML </strong>
<i>di sini</i>
<b>Tag i dan em adalah tag dengan tipe inline</b>
<em>Keduanya tidak dimulai di baris baru</em></p>
</body>
</html>
hasilnya :
Terlepas dari tampilan text yang dicetak tebal atau miring, inline
elemen adalah jenis tag yang mengikuti alur dari tag HTML yang ada.
E. MASALAH YANG DI TEMUKAN
Kebanyakan orang tidak terlalu mengetahui perbedaan dari keduanya
F. KESIMPULAN
*Block Element : Tag dengan tipe block level element, bertujuan untuk membagi halaman HTML menjadi bagian yang terpisah, atau menjadi ‘blok’.
*Inline Block : tag dengan tipe inline level element akan ‘menyatu’ dengan tag sebelum dan sesudahnya. Tag ini tidak akan memulai blok atau baris baru namun akan tetap berada di dalam blok tersebut.
G. REFERENSI
https://www.duniailkom.com/tutorial-text-html-perbedaan-block-element-dengan-inline-element-tag-html/
Sekian dan Terima Kasih karena sudah membaca Blog saya yang Sederhana
Ini 😁 Jika ada salah arti atau kata bisa beri komentar kalian di kolom
komentar.....
Tidak ada komentar:
Posting Komentar