Membuat Sudut Melengkung di Pojok Blog (Generator CSS Border Radius)

Membuat Sudut Melengkung di Pojok Blog (Generator CSS Border Radius)

Sesuai Judul diatas, kali ini saya akan memberikan sedikit tips cara membuat sudut pojok blog kita melengkung atau bahasa kerenya Rounded Corner, seperti yang sering kalian lihat garis ini memberikan efek tampilan yang menarik dan elegant pada blog kita.

Untuk penerapanya bisa kalian terapkan di mana saja, contoh seperti untuk Sudut Tempelate Blog,Sudut Gadget,Sudut Gambar, dsb.

Nah sekarang akan kita bahas cara membuat garis melengkung tersebut, bagi kalian yang belum tahu membuat garisnya atau kolom bisa baca postingan saya yang berjudul Contoh dan Cara Membuat Kolom atau Bingkai di Blog.
Sebenarnya dalam penggunaan Kode CSS ini sangatlah simple, hanya dengan menambahkan kode border-radius, berikut contohnya;

<div style="background-color: #5a5a5a; border: 2px solid#00FF00; padding: 5px; width: 400px;">
Tulisan Kalian Di sini...
</div>

<div style="-webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; background-color: #5a5a5a; border: 2px solid #00FF00; padding: 5px; width: 400px;">
Tulisan Kalian Di sini...
</div>

Keterangan:
background-color: warna latar bingkai.
border: perintah untuk membuat garis pada sisi bingkai.
solid: merupakan jenis garis yang ingin digunakan,untuk jenis garis yang lain bisa

kalian lihat disini.
padding: jarak antar bingkai dengan tulisan.
width: lebar bingkai.
webkit: perintah agar browser crom dan safari dapat menjalankan efek ini.
moz: perintah agar browser mozila dapat menjalankan efek ini.
radius: perintah untuk memberikan sudut lengkung
px: satuan ukuran yang ingin kaliangunakan.