Rounded Corner | Membuat Sudut menjadi Tumpul

Y Udah Sob Saya Akan Memulai Langkah Langkahnya:


1. Login Ke Akun Blog Sobat
2. Pilih Rancangan -->Edit HTML
3. Copas Kode Berikut Tepat Diatas Kode ]]>

Full rounded corner :
<br />.kotak-rounded-corner {<br /> <br /> <br /> background-color:#FFFF00;<br /> <br /> border:2px solid #FF0000;<br /> <br /> -moz-border-radius: 10px;<br /> <br /> -webkit-border-radius: 10px;<br /> <br /> -khtml-border-radius: 10px;<br /> <br /> border-radius: 10px; }


Rounded corner di kiri atas :


<br />.kotak-rounded-corner {<br /> <br /> background-color:#FFFF00;<br /> <br /> <br /> border:2px solid #FF0000;<br /> <br /> -moz-border-radius-topleft: 10px;<br /> <br /> -webkit-border-top-left-radius: 10px;<br /> <br /> -khtml-border-radius-topleft: 10px;<br /> <br /> border-top-left-radius: 10px; }

Rounded corner di atas :


<br />.kotak-rounded-corner {<br /> <br /> background-color:#FFFF00;<br /> <br /> border:2px solid #FF0000;<br /> <br /> <br /> -moz-border-radius-topleft: 10px;<br /> <br /> -moz-border-radius-topright: 10px;<br /> <br /> -webkit-border-top-left-radius: 10px;<br /> <br /> -webkit-border-top-right-radius: 10px;<br /> <br /> -khtml-border-radius-topleft: 10px;<br /> <br /> -khtml-border-radius-topright: 10px;<br /> <br /> border-top-left-radius: 10px;<br /> <br /> border-top-right-radius: 10px; }

Rounded corner di bawah :


<br />.kotak-rounded-corner {<br /> <br /> <br /> background-color:#FFFF00;<br /> <br /> border:2px solid #FF0000;<br /> <br /> -moz-border-radius-bottomleft: 10px;<br /> <br /> -moz-border-radius-bottomright: 10px;<br /> <br /> -webkit-border-bottom-left-radius: 10px;<br /> <br /> -webkit-border-bottom-right-radius: 10px;<br /> <br /> -khtml-border-radius-bottomleft: 10px;<br /> <br /> -khtml-border-radius-bottomright: 10px;<br /> <br /> border-bottom-left-radius: 10px;<br /> <br /> <br /> border-bottom-right-radius: 10px; }
Catatan :

1. Trik ini merupakan salah satu dari sekian banyak trik lainnya untuk membuat rounded corner.
2. Semakin besar nilai yang kamu masukkan (ex: 10px), maka semakin besar pula ketumpulan/belokan sudut.
3. Kode -moz-border-radius digunakan untuk firefox, -webkit-border-radius untuk Chrome dan Safari, -khtml-border-radius untuk browser-browser lama yang mendukung kode ini, serta border-radius untuk pengecekan terhadap browser-browser baru yang mungkin mendukung kode ini.
4. Kode di atas merupakan contoh penerapan rounded corner dalam kode CSS.

Selamat membuat rounded corner...

SEMOGA BERHASIL

▼ Backlinks Script ▼

URL

Code For Forum

HTML Code <a href='http://facecopz.blogspot.com/2011/06/rounded-corner-membuat-sudut-menjadi.html' target='_blank'>Rounded Corner | Membuat Sudut menjadi Tumpul</a>