Belajar Element Tag Html Div

Tanggal : 19 Aug 2018, Category : HTML, Create By : admin

Div adalah sebuah element box atau kotak yang banyak digunakan di dalam pemprograman html guna menampung  beberapa element menjadi satu kesatuan atau satu kelompok. Pengunaan div dalam pemprograman html biasanya digunakan untuk mempermudah aplikasi penggunaan style css yang kemudian di beri atribut seperti style, class, id dan lain sebagainya.

Pengunaan Tag Div Pada HTML

<div>
 <p>Belajar Element Tag HTML DIV</p>
</div>

Dalam pembuatan tag div tidak membutuhkan element lainya, hanya di dalam tag div tinggal memasukan dalam satu kesatuan tag div tersebut. Kemudian Tag html lainya yang ada di dalam tag element div akan menjadi satu kelompok. Jita blok div pembuka kita memberi sebuat atribut style maka secara otomatis tag html lain yang ada di dalam blok div tersebut akan mengikuti style dari blok div tersebut. Berikut contohnya.

<div>
 <p>Belajar Element Tag HTML DIV</p>
</div>
 
<div style="color:#F00">
 <p>Belajar Element Tag HTML DIV</p>
 <p>Memberi Style dalam div</p>
</div>  

Dari Script di atas ada dua pengelompokan div, yang pertama kelompok tidak memiliki style dan kedua memilik style, dengan sript yang kedua maka tag html di dalam blok div, akan mengikuti style dari blok div. jika di jalankan di browser maka output dari script di atas sebagai berikut.

Begitu pula jika anda dalam penggunaan style div menggunakan atribut class maupun id pengelompokan akan lebih mudah di bandingkan dengan langsung menggunakan style di div, akan tetapi kami menyrankan dalam pengelompokan div lebih fleksibel dengan menggunakan atribut class berikut contohnya

<!DOCTYPE html>
 <html>
 <head>
   <title>Belajar Element Tag HTML DIV</title>
 </head>
 <style>
   .classsatu {
     color:#0F0;
     float:left; 
     margin:100px;
   }
   #idsatu {
     color:#03F;
     float:right;
     margin:100px;
   }
 </style>
 <body>
 <div id="idsatu">
   <p>Penggunaan id tag pertama</p>
 </div>
 <div class="classsatu">
   <p>Penggunaan class tag pertama</p>
 </div> 
 
 <div id="idsatu">
   <p>Penggunaan id tag kedua</p>
 </div>
 <div class="classsatu">
   <p>Penggunaan class tag kedua</p>
 </div> 
 </body>
</html>

Dari script di atas akan membuat dua kelompok yaitu pengempokan dengan mengguakan class dan id, maka outputnya sebagai berikut

Keyword:
  • belajar element tag html div
  • tag div html
  • elemant div html
  • element div
  • contoh penggunaan div
  • div html
  • html div
  • membuat div
  • apa itu div
  • html div

Artikel Lain

Cara Restore Database Postgres Di Local

Date : 05 Aug 2018, Category : Database, Create By : admin

Selamat datang di website gudangilmuaplikasi.com, melanjutkan materi sebelumnya mengenai backup database kali ini kami akan membahas bagaimana cara restore file backup pg_dump yang di lakukan di server centos atau server lainya. Sebelum .....

Aturan Dalam Penulisan Script Php Dan Script Php Yang Sering Di Gunakan

Date : 31 Jul 2018, Category : Pemprograman Website, Create By : admin

Selamat datang di website gudangilmuaplikasi.com, untuk memulai dalam belajar pemprograman PHP, anda harus memahami dan mengenal script dalam php yang nantinya akan sering anda gunakan dalam pembuatan aplikasi berbasis website dengan .....

Membuat Database Mysql

Date : 15 Aug 2018, Category : Database, Create By : admin

Tentunya setiap aplikasi yang bersifat dinamis memerlukan adanya database sebagai penyimpan data - data website yang nantinya akan di tampilkan di dalam halaman situs website. Di dalam sebuah database memliki Tabel, .....