Membuat Round Sudut Tumpul Di Blog

Diposting olehviky on Kamis, 14 Juli 2011


Pada Kesempatan kali ini saya akan coba sharing Cara membuat Round atau sudut tumpul pada blog kamu, sudut tumpul ini bisa diterapkan pada widget atau apapun yang kita inginkan. Penasaran dan tertarik untuk membuatnya ??? sabar...
Sudut tumpul ini bisa kita terapkan pada judul sidebar ataupun bisa kita terapkan juga pada widget manapun yang kita suka hanya dengan menambahkan sedikit kode dibawahnya.
Berikut ini adalah kode untuk rounded corner atau sudut tumpul

1.Semua sudut tumpul/Full rounded corner
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;

2.Sudut tumpul diatas

-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
-webkit-border-radius-topleft: 10px;
-webkit-border-radius-topright: 10px;
-khtml-border-radius-topleft: 10px;
-khtml-border-radius-topright: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;

3.Sudut tumpul dibawah

-moz-border-radius-bottomleft: 10px;
-moz-border-radius-bottomright: 10px;
-webkit-border-radius-bottomleft: 10px;
-webkit-border-radius-bottomright: 10px;
-khtml-border-radius-bottomleft: 10px;
-khtml-border-radius-bottomright: 10px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;

4.Sudut tumpul kiri atas dan kanan bawah:

-moz-border-radius-topleft: 10px;
-moz-border-radius-bottomright: 10px;
-webkit-border-radius-topleft: 10px;
-webkit-border-radius-bottomright: 10px;
-khtml-border-radius-topleft: 10px;
-khtml-border-radius-bottomright: 10px;
border-top-left-radius: 10px;
border-bottom-right-radius: 10px;

Setelah memahami beberapa kode untuk rounded corner selanjutnya kita bisa menerapkan pada blog kita dimana yang kita inginkan sudutnya menjadi tumpul,tinggal menambahkan kode kode seperti diatas dibawah kode awalnya.

Selamat Mencoba...

{ 0 komentar.. read them below or add one }

Posting Komentar

 

Blog Archive