xZee Blog



Mengenal Kode Div di HTML

Plsy Store Street Fight
xZee Blog tutorial html
Zen Sama
xZee Blog
HTML Tutorial

HTML CODE

TENTANG

(Division) digunakan untuk membuat segalanya lebih menarik karena kode ini hampir mendukung semua atribut tag html dan tidak memiliki ketentuan dasar seperti halnya kode lain.
contoh h1-h6 pada dasarnya bisa melakukan apa yang dilakukan oleh <div> akan tetapi kode tersebut memiliki setelan standard atau dasar margin yang 4x lebih luas.

CONTOH


<div>isi</div>
tanpa ada tambahan atribut, kode div hanya berfungsi sebagai pemberi baris baru pada atas dan bawah isi.
<div class="nama">isi</div>
dengan tambahan atribut class="" kode div dapat memanggil gaya yang terdapat pada css yang sudah terpasang di Blog atau website terkait. contoh seperti berikut ini. <p><div class="cute-drop"> Aku Ditengah.. </div> <br> <div class="blank"> Contoh Background </div> <br> Menyatukan bagian class pada div. <div class="cute-special cute-box cute-sh post"> <div class="cute-fly-co cute-drop">Zen Sama</div> <div class="cute-font1 extra"> Halo Dunia... </div> </div></p>
hasil dari kode diatas seperti berikut ini.

Aku Ditengah..

Contoh Background

Menyatukan bagian class pada div.
Zen Sama
Halo Dunia...

Seperti yang Admin xZee tulis diatas class hanya bisa memanggil dan menampilkan apabila terdapat data yang sesuai pada css yang terpasang.

Contoh sederhana

<div class="cute-drop">Aku ada ditengah</div> <div class="a-merah">Aku di background merah</div> <div class="bolder">Aku tebal bener</div> <div class="bigger">Aku sangat besar</div> <div class="cute-deploy">Aku Sangat Luas</div>

Hasil kode diatas


Aku ada ditengah
Aku di background merah
Aku tebal bener
Aku sangat besar
Aku Sangat Luas

Contoh Penerapan

<div class="cute-drop a-merah bolder bigger cute-deploy"> Dan Sekarang<br> Kami Semua<br> Ber.. Satu.. </div>

Hasil

Dan Sekarang
Kami Semua
Ber.. Satu..

<div style="gaya">isi</div>
dengan tambahan atribut style="" kode div dapat disesuaikan menjadi seperti apa yang ingin dilihat.
atribut style sendiri merupakan cara alternatif lain untuk meletakkan sebuah gaya tanpa harus memerlukan css seperti atribut class.

Contoh Penerapan

<div style=" background: #48CC58; color: black; ">Halo dunia.. apa kabar kamu hari ini</div>

Halo dunia.. apa kabar kamu hari ini


<div style=" background: #48CC58; color: black; border: 3px groove #FFFC5F; ">Halo dunia.. apa kabar kamu hari ini</div>

Halo dunia.. apa kabar kamu hari ini


<div style=" background: #48CC58; color: black; border: 3px groove #FFFC5F; padding: 5px; ">Halo dunia.. apa kabar kamu hari ini</div>

Halo dunia.. apa kabar kamu hari ini


untuk selengkapnya tentang style akan saya bahas pada posting lain.
Share This Post

Post Detail


Posted By: Zen Sama
Posted On: 04 Nov 2017 22:04
Category: Belajar HTML dan CSS


Leave a Comment

Lenna Gracie
Lenna Gracie
04 Nov 2017 22:04
Hello.. No comments yet on "Mengenal Kode Div di HTML"
Why not to be first user comment?

Please Login first for post a comment

Please switch off your AdBlock and refresh this page :)