HTML Next Level | Span dan Div

Jika p digunakan untuk membuat paragraf, h1 untuk header, tag span dan div tidak berarti apa-apa.
Tapi kedua tag ini juga memiliki kegunaan yang akan sangat membantu yaitu untuk mengelompokkan suatu tag. Lalu kelompok ini dapat dipanggil/digunakan di CSS. jadi singkat kata, tag div dan span digunakan di CSS.
Perbedaan antara kedua tag ini yaitu, span biasa digunakan untuk bagian kecil html.
Biasanya tag span digunakan didalam paragraf. Sedangkan tag div(division) biasa digunakan untuk bagian yang lebih.
Contoh penggunaanya :

<div id="divisi">
    <p>This is <span class="paper">Next level</span></p>
</div>

Setelah anda coba, tentu yang tampilan adalah teks biasa.
Biar lebih jelas, ini contoh penggunaan div dan span pada HTML dan CSS.



<html>
<head>
<title> Percobaan Div dan Span</title>
<style type="text/css">

#badan {
background-color : #FFFF20 ;
}

.tungir {
text-decoration: underline;
}

</style>
</head>
<body>
<div id="badan">
<p>
Ini adalah paragraf. Paragraf adalah ini. Ini adalah paragraf. Paragraf adalah ini. Ini adalah paragraf. Paragraf adalah ini.
<span class="tungir">Tungir</span>
</p>

<p>
Ini juga paragraf, tapi ini paragraf 2. Ini juga paragraf, tapi ini paraagraf 2. Ini juga paragraf, tapi ini paraagraf 2. Ini juga paragraf, tapi ini paraagraf 2. 
</p>
</div>
</body>
</html>

0 komentar:

Posting Komentar

Hai :)




Kategori