Kamis, 07 November 2013
Browse Manual »
Wiring »
border
»
css
»
dengan
»
mempercantik
»
table
»
Mempercantik Border Table dengan CSS
Semoga ada manfaatnya
Mempercantik Border Table dengan CSS
Terus terang sekarang lagi Blank Mau posting apa.... !!! :r; sedangkan disatu sisi lainnya jadwal posting wajib untuk mengecilkan Traffic Blog, untuk itu saya mohon maaf untuk kawan yang setia mengunjungi Creation :z; karena apa yang akan saya bagikan sekarang ini sudah umum diterapkan oleh para Blogger, tapi tak ada salahnya untuk kawan Blogger Pemula yang belum tahu atau mengetahui, Cara Mempercantik Border Table dengan CSS :y;
Sebelum melangkah lebih jauh alangkah baiknya kawan mengetahui Pedoman Dasar CSS, karena tanpa ini Tampilan Blog kawan sebagai contoh bagus di Chrome belum tentu bagus di Mozilla :q;
 |
| Dasar CSS Border |
 |
| screenshot untuk Tab Menu |
Cara Membuatnya :
CONTOH | <div style="border: 2px solid #000; margin: 0; padding: 5px; text-align: center;"> CONTOH </div> |
CONTOH | <div style="border:2px solid #000000;-moz-transform: skew(32deg,12deg);- webkit-transform: skew(32deg,12deg);"> CONTOH </div> |
CONTOH | <div style="-moz-transform: skew(02deg,150deg); -webkit-transform: skew(02deg,150deg); border: 2px solid #000000; "> CONTOH </div> |
CONTOH | <div style="border:2px solid #000000;-moz-border-radius-topright: 0px 0px;-moz-border-radius-bottomright: 10px 10px; -webkit-border-top-right-radius: 0px 0px;-webkit-border-bottom-right-radius: 10px 10px; border-top-right-radius:0px 0px;border-bottom-right-radius: 10px 10px; "> CONTOH </div> |
CONTOH | <div style="border:2px solid #000000;-moz-border-radius-topleft: 10px 10px;-moz-border-radius- bottomleft: 0px 0px; -webkit-border-top-left-radius: 10px 10px;-webkit-border-bottom-left-radius: 0px 0px; -border-top-left-radius:10px 10px;-border-bottom-left-radius: 0px 0px;">CONTOH</div> |
CONTOH | <div style="border:2px solid #000000;-moz-border-radius-topleft: 10px 10px;-moz-border-radius-bottomleft: 10px 10px; -webkit-border-top-left-radius: 10px 10px;-webkit-border-bottom-left-radius: 10px 10px; -border-top-left-radius: 10px 10px;-border-bottom-left-radius: 10px 10px;"> CONTOH </div> |
CONTOH | <div style="border:2px solid #000000;-moz-border radius-topright: 10px 10px;-moz-border-radius-bottomright: 10px 10px; -webkit-border-top-right-radius: 10px 10px;-webkit-border-bottom-right-radius: 10px 10px; border-top-right-radius: 10px 10px;border-bottom-right-radius: 10px 10px; ">CONTOH</div> |
CONTOH | <div style="border:2px solid #000000;-moz-border-radius-topleft: 10px 10px;-moz-border-radius-bottomleft: 10px 10px; -webkit-border-top-left-radius: 10px 10px;-webkit-border-bottom-left-radius: 10px 10px; -border-top-left-radius: 10px 10px;-border-bottom-left-radius: 10px 10px;-moz-border-radius-topright: 10px 10px;-moz-border-radius-bottomright: 10px 10px; -webkit-border-top-right-radius: 10px 10px;-webkit-border-bottom-right-radius: 10px 10px; border-top-right-radius: 10px 10px;border-bottom-right-radius: 10px 10px;"> CONTOH </div> atau cara simpelnya <div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; border: 2px solid #000000;">CONTOH </div> |
CONTOH | <div style="-moz-border-radius: 100px; -webkit-border-radius: 100px; border-radius: 100px; border: 2px solid #000000; height: 90px; padding: 5px; text-align: center; width: 90px;"> CONTOH </div> |
Semoga ada manfaatnya
Langganan:
Posting Komentar (Atom)
Tidak ada komentar:
Posting Komentar