Selamat pagi kawan, Kali ini saya akan posting tutorial blog yang mungkin kawan butuhkan, langsung saja. kali ini membuat macam-macam kotak dalam postingan, biasanya ini dibutuhkan/dipergunakan untuk kode HTML, kata yang penting juga banyak yang lainnya, oke dech mungkin kawan sudah mengerti jadi. Langsung saja, Cekidot>
Berikut langkah-langkah untuk bikin macam-macam tampilan kotak dalam postingan :
1. Kode untuk Solid Border
<div style="border: 2px #FF0000solid; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div>
Maka hasilnya seperti ini :
2. Kode untuk Ridge Border
<div style="border: 2px #FF0000 ridge; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div>
Maka hasilnya seperti ini :
3. Kode untuk Groove Border
<div style="border: 2px #FF0000 ridge; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div>
Maka hasilnya seperti ini :
4. Kode untuk Inset Border
<div style="border: 2px #FF0000 inset; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div>
Maka hasilnya seperti ini :
5. Kode untuk Outset Border
<div style="border: 2px #FF0000 outset; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div>
Maka hasilnya seperti ini :
6. Kode untuk Double Border
<div style="border: 2px #FF0000 double; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div>
Maka hasilnya seperti ini :
7. Kode untuk Dotted Border
<div style="border: 2px #FF0000 dotted; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div>
Maka hasilnya seperti ini :
8. Kode untuk Dashed Border
<div style="border: 2px #FF0000 solid; padding: 10px; background-color: #FFCC00; overflow: auto; height: 50px; width: 300px; text-align: left;"> Isi dengan tulisan kawan disini </div>
Maka hasilnya seperti ini :
9. Kode untuk Dashed Border
<div style="border: 2px #FF0000 dashed; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini </div>
Maka hasilnya seperti ini :
10. Kode untuk Border dengan scroll, lebar dan tinggi
<div style="border: 2px #FF0000 solid; padding: 10px; background-color: #FFCC00; overflow: auto; height: 50px; width: 300px; text-align: left;"> Isi dengan tulisan kawan disini </div>
Maka hasilnya seperti ini :
Keterangan :
1. Tulisan berwarna pink : silahkan ganti dengan kode HTML yang anda inginkan.
2. Tulisan yang berwarna biru : ganti dengan kode warna menurut selera anda. Untuk mengganti kode warna silahkan kawan lihat di postingan saya mengenai Kode warna
3. Perlu diketahui : Dalam penulisan kode HTML yang ingin kawan tampilkan pada postingan harus pada posisi HTML bukan Compose.
Berikut langkah-langkah untuk bikin macam-macam tampilan kotak dalam postingan :
1. Kode untuk Solid Border
<div style="border: 2px #FF0000solid; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div>
Maka hasilnya seperti ini :
Isi dengan tulisan kawan disini
2. Kode untuk Ridge Border
<div style="border: 2px #FF0000 ridge; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div>
Maka hasilnya seperti ini :
Isi dengan tulisan kawan disini
3. Kode untuk Groove Border
<div style="border: 2px #FF0000 ridge; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div>
Maka hasilnya seperti ini :
Isi dengan tulisan kawan disini
4. Kode untuk Inset Border
<div style="border: 2px #FF0000 inset; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div>
Maka hasilnya seperti ini :
Isi dengan tulisan kawan disini
5. Kode untuk Outset Border
<div style="border: 2px #FF0000 outset; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div>
Maka hasilnya seperti ini :
Isi dengan tulisan kawan disini
6. Kode untuk Double Border
<div style="border: 2px #FF0000 double; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div>
Maka hasilnya seperti ini :
Isi dengan tulisan kawan disini
7. Kode untuk Dotted Border
<div style="border: 2px #FF0000 dotted; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini</div>
Maka hasilnya seperti ini :
Isi dengan tulisan kawan disini
8. Kode untuk Dashed Border
<div style="border: 2px #FF0000 solid; padding: 10px; background-color: #FFCC00; overflow: auto; height: 50px; width: 300px; text-align: left;"> Isi dengan tulisan kawan disini </div>
Maka hasilnya seperti ini :
Isi dengan tulisan kawan disini
9. Kode untuk Dashed Border
<div style="border: 2px #FF0000 dashed; padding: 10px; background-color: #FFCC00; text-align: left;"> Isi dengan tulisan kawan disini </div>
Maka hasilnya seperti ini :
Isi dengan tulisan kawan disini
10. Kode untuk Border dengan scroll, lebar dan tinggi
<div style="border: 2px #FF0000 solid; padding: 10px; background-color: #FFCC00; overflow: auto; height: 50px; width: 300px; text-align: left;"> Isi dengan tulisan kawan disini </div>
Maka hasilnya seperti ini :
Isi dengan tulisan kawan disini
Keterangan :
1. Tulisan berwarna pink : silahkan ganti dengan kode HTML yang anda inginkan.
2. Tulisan yang berwarna biru : ganti dengan kode warna menurut selera anda. Untuk mengganti kode warna silahkan kawan lihat di postingan saya mengenai Kode warna
3. Perlu diketahui : Dalam penulisan kode HTML yang ingin kawan tampilkan pada postingan harus pada posisi HTML bukan Compose.
Softwarenya yaitu Photo MakeUp Editor. Dari namanya kawan sudah bisa menyimpulkan apa kegunaan dari software ini bukan.
Yups software ini berguna untuk memberi make up pada wajah, juga bisa menghilangkan jerawat, memperhalus wajah, memutihkan gigi, dan masih banyak lagi.
langsung saja, Cekidot>
ScreenShot>>
Sesudah>>
Gimana tertarik-kah, silahkan kawan download. Maaf editingnya jeulek hehehe tidak bisa editing saya mohon dimaklum saja ^_^
Password: iq-dua3
Size: 3 Mb
^_^ Semoga Bermanfaat ^_^