Perbedaan Antara Tag Div Dan Span
Tuesday, February 16, 2016
Add Comment
Setiap tag HTML mempunyai tujuan atau makna masing-masing menyerupai tag
Pengertian Tag
Tag
Contoh yang paling sering untuk penggunaan tag
Untuk menciptakan tampilan website di atas terlihat manis kita sanggup memakai CSS, tapi untuk pembahasan kali ini Saya tidak akan memakai CSS.
Pada tumpuan instruksi di atas, masing-masing tag
Perbedaan Antara Tag
Perbedaan antara tag
Supaya lebih paham silahkan ketikan instruksi di bawah ini :
Terlihat teks "Ini yaitu kalimat pertama" yang di apit oleh tag
Supaya lebih paham silahkan ketikan instruksi di bawah ini :
Terlihat pada gambar di atas teks "Ini yaitu kalimat pertama" yang berada diantara tag
Selain itu di dalam jenis tag block line juga sanggup di tambahkan tag block line yang lain, maupun tag in line. Contohnya menyerupai instruksi di bawah ini :
Terlihat pada tumpuan instruksi di atas, terdapat 2 jenis tag block line yaitu tag
Jika Anda belum tahu apa itu CSS Anda tidak perlu khawatir nanti akan Saya bahas pada Tutorial CSS, yang perlu Anda ingat tag
Pada artikel selanjutnya kita akan membahas Cara Mengatur Posisi dan Tampilan Gambar di HTML.
<h1> hingga dengan tag <h6> untuk menciptakan judul, tag <p> untuk menciptakan paragraf, tag <a> untuk menciptakan link dan masih banyak lagi yang lain. Namun terdapat 2 buah tag yang tidak mempunyai makna apa-apa, yaitu tag <div> dan <span>. Walaupun tidak mempunyai makna apa-apa tapi tag ini sering di gunakan untuk menciptakan struktur website ataupun untuk memberi style pada sebuah teks, nah pada artikel kali ini Saya akan membahas wacana perbedaan antara tag <div> dan <span> secara lebih mendalam. Pengertian Tag <div> dan <span>
Tag <div> dan <span> yaitu tag yang tidak mempunyai makna apa-apa, walaupun begitu tag ini sering di gunakan untuk menciptakan struktur atau bagian-bagian website. Itu alasannya yaitu tag <div> dan <span> yang tidak mempunyai makna apa-apa, sanggup dengan gampang di tambahkan style-nya atau tampilannya dengan CSS.Contoh yang paling sering untuk penggunaan tag
<div> yaitu sebagai pemisah satu bab instruksi HTML dengan bab instruksi HTML yang lainnya. Berikut ini yaitu tumpuan instruksi HTML yang memakai tag <div> :<!DOCTYPE html> <html> <head> <title>Belajar HTML</title> <meta charset="utf-8"/> </head> <body> <div id="header"> <h1>Nama website</h1> </div> <div id="menu"> <ul> <li><a href="#">Home</a></li> <li><a href="#">About</a></li> <li><a href="#">Contact</a></li> </ul> </div> <div id="article"> <p>Isi dari artikel...</p> </div> <div id="sidebar"> <h3>Artikel Popular</h3> <ul> <li><a href="#">Artikel 1</a></li> <li><a href="#">Artikel 2</a></li> <li><a href="#">Artikel 3</a></li> </ul> </div> <div id="footer"> <p>Copyright © 2017 </p> </div> </body> </html>
Untuk menciptakan tampilan website di atas terlihat manis kita sanggup memakai CSS, tapi untuk pembahasan kali ini Saya tidak akan memakai CSS.
Pada tumpuan instruksi di atas, masing-masing tag
<div> mempunyai atribut id yang membedakan dengan tag <div> yang lainnya. Perbedaan Antara Tag <div> dan <span>
Perbedaan antara tag <div> dan <span> yaitu pada jenis tag-nya. Tag <div> merupakan jenis tag block line sedangkan tag <span> termasuk ke dalam jenis tag in line. Berikut ini klarifikasi wacana perbedaan tag berjenis in line dan block line.Block Line
Block line yaitu tag yang memisahkan dirinya dengan tag lain yang ada di sekitarnya. Block line umumnya akan menciptakan baris gres secara otomatis. Contoh tag yang termasuk jenis block line yaitu tag untuk menciptakan judul<h1> hingga <h6>, tag untuk menciptakan paragraf <p>, tag untuk menciptakan tabel <table>, dan tag yang tidak mempunyai makna apa-apa<div> .Supaya lebih paham silahkan ketikan instruksi di bawah ini :
<!DOCTYPE html> <html> <head> <title>Belajar HTML</title> <meta charset="utf-8"/> </head> <body> <div>Ini yaitu kalimat pertama</div> <div>Ini yaitu kalimat kedua</div> </body> </html>
Terlihat teks "Ini yaitu kalimat pertama" yang di apit oleh tag
<div>..</div> pada gambar di atas, akan menciptakan sebuah blok dan secara otomatis akan menciptakan baris gres yang menciptakan teks "Ini yaitu kalimat kedua" berpindah baris. Itu alasannya yaitu tag <div> mempunyai style bawaan browser yaitu display: block; yang memungkinkan tag <div> menciptakan sebuah blok yang panjang.In Line
Jenis tag in line tidak akan menciptakan baris gres ataupun menciptakan sebuah blok. Tag ini cenderung akan menyambung dengan tag yang di sekitarnya dalam baris yang sama. Contoh jenis tag in line yaitu tag untuk menciptakan garis miring<i> dan <em>, tag untuk menciptakan garis tebal <strong> dan <b>, tag untuk menciptakan link <a> dan tag yang tidak mempunyai makan apa-apa <span>.Supaya lebih paham silahkan ketikan instruksi di bawah ini :
<!DOCTYPE html> <html> <head> <title>Belajar HTML</title> <meta charset="utf-8"/> </head> <body> <span>Ini yaitu kalimat pertama</span> <span>Ini yaitu kalimat kedua</span> </body> </html>
Terlihat pada gambar di atas teks "Ini yaitu kalimat pertama" yang berada diantara tag
<span>...</span> tidak akan menciptakan sebuah blok yang panjang dan terlihat menyambung dengan teks "Ini yaitu kalimat kedua" atau tag yang ada di sekitarnya pada baris yang sama. Itu alasannya yaitu tag <span> tidak mempunyai style bawaan browser yang memungkinkan tag <span> sanggup menyambung dengan tag yang ada di sekitarnya.Selain itu di dalam jenis tag block line juga sanggup di tambahkan tag block line yang lain, maupun tag in line. Contohnya menyerupai instruksi di bawah ini :
<!DOCTYPE html> <html> <head> <title>Belajar HTML</title> <meta charset="utf-8"/> <style> #kalimat { padding: 10px; background: palegreen; } #belajar-html { color: blueviolet; font-weight: bold; } </style> </head> <body> <div id="kalimat"> <p>Sekarang Saya sedang mencar ilmu <span id="belajar-html">HTML</span>.</p> </div> </body> </html>
Terlihat pada tumpuan instruksi di atas, terdapat 2 jenis tag block line yaitu tag
<p> dan <div>, dan terdapat 1 jenis tag in line yaitu tag <span>. Tag <p> berada di dalam tag <div> sedangkan tag <span> berada di dalam tag <p>. Itu artinya jenis tag block line juga sanggup di tambahkan tag block line yang lain dan juga tag in line. Tampilan latar belakang teks dan juga warna teks kita memakai CSS.Jika Anda belum tahu apa itu CSS Anda tidak perlu khawatir nanti akan Saya bahas pada Tutorial CSS, yang perlu Anda ingat tag
<div> dan <span>merupakan tag tanpa makna yang sanggup kita maknai dengan CSS.Pada artikel selanjutnya kita akan membahas Cara Mengatur Posisi dan Tampilan Gambar di HTML.
0 Response to "Perbedaan Antara Tag Div Dan Span"
Post a Comment