Home » » Macam Macam Div Style

Macam Macam Div Style

Macam Macam Div Style | Tutorial Blog

Pada postingan ini saya akan berbagi tentang beberapa kode untuk membuat Div Style. Langsung saja Sob, berikut kodenya :
  • Kode :
    <div style="border: 2px solid blue;"> <div style="border: 3px solid red;"> <div align="center"> Tulis Text Disini</div> </div> </div>
    Hasilnya :
    Tulis Text Disini
  • Kode :
    <div style="border: 4px solid yellow;"> <div align="center"> <span style="color: coral;">Tulis Text Disini</span></div> </div>
    Hasilnya
    Tulis Text Disini
  • Kode :
    <div style="border: 3px double #ff0000; padding: 5px;"><div align="center">Tulis Text Disini</div></div>
    Hasilnya :
    Tulis Text Disini
  • Kode :
    <div style="border: 3px double #0000ff; padding: 5px;"><div style="border: 2px solid #0077ff; padding: 5px;"><div align="center">Tulis Text Disini</div></div></div>
    Hasilnya :
    Tulis Text Disini
  • Kode :
    <div style="border-color: lime; border-style: dotted; border-width: 2px; margin: 1px; padding: 1px;"><center>Tulis Text Disini</center></div>
    Hasilnya :
    Tulis Text Disini
  • Kode :
    <div style="border-style:inset;border-width:5pt;border-color:black" align="center">Tulis Text Disini</div>
    Hasilnya :
    Tulis Text Disini
  • Kode :
    <div style="background: #bbddff; border: 5px outset#c0c0c0; margin: 0px; padding: 5px;"><div align="center">Tulis Text Disini</div></div>
    Hasilnya :
    Tulis Text Disini
  • Kode :
    <div style="border: 2px solid#220000;"><div style="border: 2px solid#dddddd;"><div style="border: 4px solid#220000;"><div style="border: 2px solid#dddddd;"><div style="border: 2px solid#220000;"><div align="center"><span style="color: red;">Tulis Text Disini</span></div></div></div></div></div></div>
    Hasilnya :
    Tulis Text Disini
  • Kode :
    <div style="border: 1px solid#2222ff;"><div style="border: 1px solid#3333ff;"><div style="border: 1px solid#4444ff;"><div style="border: 1px solid#5555ff;"><div style="border: 1px solid#2222ff;"><div style="border: 1px solid#3333ff;"><div style="border: 1px solid#4444ff;"><div style="border: 1px solid#5555ff;"><div style="background-color: #44ccff;"><div align="center"><span style="color: red;">Tulis Text Disini</span></div></div></div></div></div></div></div></div></div></div>
    Hasilnya :
    Tulis Text Disini
  • Kode :
    <div style="border: 3px solid#2222ff;"><div style="background-image: url('http://i1193.photobucket.com/albums/aa345/bakulatz/Arsiv/linerbn.gif'); border: 0px; margin: 2px; padding: 2px;"><div style="background-color: #cccccc;"><div align="center"><span style="color: red;">Tulis Text Disini</span></div></div></div></div>
    Hasilnya :
    Tulis Text Disini
  • Kode :
    <div style="border: 1px solid#001100;"><div style="border: 1px solid#002200;"><div style="border: 1px solid#003300;"><div style="border: 1px solid#004400;"><div style="border: 1px solid#005500;"><div style="border: 1px solid#006600;"><div style="border: 1px solid#007700;"><div style="border: 1px solid#008800;"><div style="border: 1px solid#009900;"><div style="border: 1px solid#00aa00;"><div style="border: 1px solid#009900;"><div style="border: 1px solid#008800;"><div style="border: 1px solid#007700;"><div style="border: 1px solid#006600;"><div style="border: 1px solid#005500;"><div style="border: 1px solid#004400;"><div style="border: 1px solid#003300;"><div style="border: 1px solid#002200;"><div style="border: 1px solid#001100;">
    <div align="center"><span style="color: red;">Tulis Text Disini</span></div>
    </div></div></div></div></div></div></div></div></div></div></div></div></div></div></div></div></div></div></div>
    Hasilnya :
    Tulis Text Disini
Sepertinya segitu dulu Sob, kalau ada yang mau menambahkan silakan tulis di komentar.
Silakan dicoba dan semoga berhasil...

PENTING!!!
ANDA TIDAK BEKERJA? INGIN TAHU INFORMASI LOWONGAN KERJA TERBARU DI KOTA ANDA? KUNJUNGI LOWONGAN KERJA TERBARU DISINI
Jika Anda menyukai Artikel di blog ini, Silahkan klik disini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di Delta Komputer

0 komentar:

Posting Komentar

 
Support : PING by :Ping-o-Matic | Pusat Promosi
Copyright © 2011. Tutorial dan Free Download - All Rights Reserved
Template Modify by Creating Website
Re Design by Bang Aris