Cara Membuat Garis Melengkung Pada Sudut Kotak

Pernahkah sobat blogger melihat kotak atau gambar dengan garis yang melengkung pada sudut kotak. Lengkungan garis ini biasanya digunakan untuk membuat blog menjadi lebih cantik dan menarik. Jika anda tertarik gimana cara membuat kolom postingan dengan garis melengkung silahkan ikuti trik berikut ini.

1. Login ke blogger.
2. Masuk ke Rancangan -- Edit HTML
3. Back up template anda
4. Modifikasi kode CSS dengan cara mempaste mengkopi kode berwarna biru dibawah ini lalu paste ke kode CSS kotak posting atau gambar

Hasilnya seperti ini

border-1 {
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
border: 3px solid #A89D61;
}

Hasilnya seperti ini

.border-2 {
-moz-border-radius-topleft: 25px;
-moz-border-radius-bottomright: 25px;
-webkit-border-top-left-radius: 25px;
-webkit-border-bottom-right-radius: 25px;
border: 3px solid #A89D61;
}

Hasilnya seperti ini

.circle {
-moz-border-radius: 80px;
-webkit-border-radius: 80px;
border-radius: 80px;
border: 2px solid #A89D61;
background:#D2CCAD;
width: 200px;
height: 200px;
}

Posted in: Kolom,Tips dan Triks