CSS Code : Sudut Lengkung

Sebelum anda membaca artikel yang satu ini mungkin anda menghias blog dengan warna latar dan garis tepi warna warni dengan menyisipkan kode latar belakang image, terutama untuk membuat garis tepi dangan sudut lengkung.

Sebenarnya ada kode CSS yang dapat dipergunakan untuk untuk membuat garis tepi (misal, main dan sidebar) dengan sudut lengkung, namun sayangnya kode CSS ini hanya berlaku untuk browser Firefox dan Google Chrome meski bukan tidak mungkin dikemudian hari browser lain (IE, Opera, dll) juga akan mengupdate aplikasi mereka agar dapat menjalankan kode CSS tersebut.

Kode Tersebut Adalah Sebagai Berikut :
  1. Membuat sudut lengkung ke empat sudut : -moz-border-radius:12px;
  2. Membuat sudut lengkung kiri atas : -moz-border-radius-topleft:12px;
  3. Membuat sudut lengkung kanan atas : -moz-border-radius-topright:12px;
  4. Membuat sudut lengkung kiri bawah : -moz-border-radius-bottomleft:12px;
  5. Membuat sudut lengkung kanan bawah : -moz-border-radius-bottomright:12px;
Cara Pakai
Sisipkan kode diatas pada main wrapper atau sidebar wrapper blog anda atau dapat juga digunakan pada saat memberi latar belakang suatu paragraf sebuah posting.

Catatan
Anda dapat mengganti angka 12px dengan angka lain untuk menentukan tingkat lengkung sudut yang ingin dibuat, misalnya 10px, 15 px, dll.

Contoh Untuk Penggunaan Latar belakang

Contoh Membuat Sudut Lengkung

Contoh Penggunaan Pada Main Wrapper atau Sidebar Wrapper

#main-wrapper {
.........
-moz-border-radius:12px;
background-color: #ffffff;
.........
.........
}