HTML Borders Backgrounds ( seri 2 )

HTML Borders Backgrounds ( seri 2 ) - Baca dulu HTML Borders Backgrounds ( seri 1 ),dan nantikan HTML Borders Backgrounds ( seri 3 ) . . . .tetap ikutin blog ini terus ya. . . . .

Keterangan : Di bawah adalah Contoh Border dan di dalamnya adalah kode bordernya.

Dashed Borders

<p style="border: dashed 5px #ddddff; padding: 15px; margin: 0; text-align: justify; line-height: 23px; color: #191970; font-size: 18px">YOUR STUFF HERE</p>

Dotted Borders

<p style="border: dotted 3px #ddddff; padding: 15px; margin: 0; text-align: justify; line-height: 23px; color: #191970; font-size: 18px">YOUR STUFF HERE</p>

Double Borders

<p style="border: double 10px #ddddff; padding: 15px; margin: 0; text-align: justify; line-height: 23px; color: #191970; font-size: 18px">YOUR STUFF HERE</p>

Inset Borders

<p style="border: inset 10px #ddddff; padding: 15px; margin: 0; text-align: justify; line-height: 23px; color: #191970; font-size: 18px">YOUR STUFF HERE</p>

Groove Borders

<p style="border: groove 10px #ddddff; padding: 15px; margin: 0; text-align: justify; line-height: 23px; color: #191970; font-size: 18px">YOUR STUFF HERE</p>

Outset Borders

<p style="border: outset 10px #ddddff; padding: 15px; margin: 0; text-align: justify; line-height: 23px; color: #191970; font-size: 18px">YOUR STUFF HERE</p>

Ridge Borders

<p style="border: ridge 10px #ddddff; padding: 15px; margin: 0; text-align: justify; line-height: 23px; color: #191970; font-size: 18px">YOUR STUFF HERE</p>

Rounded Border no Background

<p style="border: solid 10px #ddddff; padding: 15px; -moz-border-radius: 15px; -khtml-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; margin: 0; text-align: justify; line-height: 23px; color: #191970; font-size: 18px">YOUR STUFF HERE</p>

Rounded Border with Background

<p style="border: solid 10px #99aabb; background: #ddddff; padding: 15px; -moz-border-radius: 15px; -khtml-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; margin: 0; text-align: justify; line-height: 23px; color: #191970; font-size: 18px">YOUR STUFF HERE</p>

<p style="border: solid 10px #005588; background: #ffaa00; padding: 15px; -moz-border-radius: 15px; -khtml-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; margin: 0; text-align: justify; line-height: 23px; color: white; font-size: 18px">YOUR STUFF HERE</p>

TIPS :

• Untuk mengganti warna : ganti kodewarnanya  pada kode "color : (kode warna)" Baca : Kode Warna HTML
• Untuk mengganti jenis tulisan, apakah rata kanan-rata kiri dsb : ganti pada kode "text-align: justify" 
• Baca : Membuat Border Style dengan CSS
• Baca : Membuat Border Radius

Tetap Setia !!

- Penulis : Damar Saloka Anggoro - Judul : HTML Borders Backgrounds ( seri 2 )

• Berlangganan newsletter Ka Damar Blog Tips dan Anda akan dapat men-download "EBOOK TRIK TIPS BLOGGER" secara gratis
• Anda juga akan menerima Update Artikel terbaru secara otomatis ke Inbox Email Anda.

Nama Kamu*
Email*

Related Post:

Cara Membuat Related Post seperti ini