15/10/2011 12:18
lutfietutor.blogspot.com
Lutfie Tutorial Blog
Cara Membuat Border CSS Rounded
Corner
CSS Rounded Corner
Bismillah... setelah beberapa hari saya absen dari
dunia blog kini Lutfie Tutorial blog akan share cara
membuat Rounded Corner dengan CSS, jika sobat
“ -webkit-border-radius: 10px;
-moz-border-radius: 10px;
border:#d81b21 solid;
Semakin besar radius yang soba berikan makan
belum tau apa itu Rounded Corner? pada postin- lengkungnya akan semakin dalam sebagai contoh
gan ini insya allah saya akan sedikit memberikan kita tambahkan yang tadinya 10px menjadi 20px.
penjelasan tentang CSS Rounded Corner.
Rounded Corner Adalah suatu teknik membuat
“
garis lengkung di pojok baik di halaman web/situs
atau dimana saja tanpa menggunakan gambar tapi -webkit-border-radius: 20px;
dengan menggunakan kode CSS, jika sobat seorang -moz-border-radius: 20px;
designer web maka teknik ini perlu di kuasai, karena border:#d81b21 solid;
dengan teknik CSS ini situs akan terlihat menarik
dan lebih stylish. oke mungkin dari penjelasan
diatas sobat sudah paham dengan yang namanya
Rounded Corner, jika belum mari lihat contoh di itu untuk dasar membuat rounded corner, sekarang
bawah. bagaimana jika kita ingin membuat garis lengkun-
gnya cuma sebelah kanan saja
Click here to send your feedback
Untuk membuat rounded Corner sangatlah mudah
sobat tinggal menghapalkan beberpa code di bawah
ini. Rounded Corner Sebelah kanan
• -webkit-border-radius: ukuran;
“
• -moz-border-radius: ukuan;
-webkit-border-top-right-radius: 10px;
-webkit-border-bottom-right-radius: 10px;
Sebagai Contoh : -moz-border-radius-topright: 10px;
CSS Rounded Corner Dengan : -moz-border-radius-bottomright: 10px;
joliprint
border:#d81b21 solid; Rounded Corner Se-
belah kiri
-webkit-border-radius: 10px;
“
Printed with
-moz-border-radius: 10px;
-webkit-border-top-left-radius: 10px;
border:#d81b21 solid; -webkit-border-bottom-left-radius: 10px;
http://lutfietutor.blogspot.com/2011/10/cara-membuat-borber-css-rounded-corner.html
Page 1
15/10/2011 12:18
lutfietutor.blogspot.com
Cara Membuat Border CSS Rounded Corner
-moz-border-radius-topleft: 10px;
-moz-border-radius-bottomleft: 10px;
border:#d81b21 solid; Rounded Corner kiri
atas dan kanan Bawah
“ -webkit-border-top-left-radius: 10px;
-webkit-border-bottom-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-bottomright: 10px;
border:#d81b21 solid; Rounded Corner kiri
atas dan kanan Bawah
“ -webkit-border-top-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-topright: 10px;
-moz-border-radius-bottomleft: 10px;
border:#d81b21 solid;
Dari beberapa Contoh diatas mungkin sobat sudah
tau dan mengerti tetang rounded corner, mungkin
itu saja dulu yang saya dapat share pada postin-
gan kali ini semoga bermanpaat,Good Luck Happy
Blogging
Click here to send your feedback
These icons link to social bookmarking sites where
readers can share and discover new web pages.
joliprint
Printed with
http://lutfietutor.blogspot.com/2011/10/cara-membuat-borber-css-rounded-corner.html
Page 2