Membuat Border Gradasi Dengan Css 3

CSS 3 menyediakan fitur dalam membuat border dengan warna gradasi. Fitur ini merupakan bab dari properti border pada CSS 3. Dengan begitu desain web yang kita buat akan terlihat lebih elegan dan menarik. Warna yang dihasilkan berupa warna yang memudar (gradient) baik gradasi gelap ke terang maupun dari terang ke gelap. Langkah yang dipakai yakni dengan menunjukkan beberapa nilai warna untuk membuat efek gradasi. Efek ini hanya dapat dilihat pada web browser mozilla firefox.

Lihat Contoh berikut ini!











Berikut ini merupakan script CSS yang dipakai untuk membuat border gradasi.

border: 10px solid;
-moz-border-bottom-colors: #030 #060 #080 #0A0 #0B0 #0C0 #0d0 #0e0 #0f0 #0f2 #0f4 #0f6;
-moz-border-top-colors: #030 #060 #080 #0A0 #0B0 #0C0 #0d0 #0e0 #0f0 #0f2 #0f4 #0f6;
-moz-border-left-colors: #030 #060 #080 #0A0 #0B0 #0C0 #0d0 #0e0 #0f0 #0f2 #0f4 #0f6;
-moz-border-right-colors: #030 #060 #080 #0A0 #0B0 #0C0 #0d0 #0e0 #0f0 #0f2 #0f4 #0f6;
height: 200px;
width: 400px; 

Selamat Mencoba Kawan!!!
Ingat!!, efek gradasi tersebut hanya dapat dipakai pada browser mozilla firefox. Silahkan tuliskan komentar jikalau tutorial di atas kurang terang dan berikanlah saran yang membangun.
Ayo berguru bersama kawan...

Subscribe to receive free email updates:

0 Response to "Membuat Border Gradasi Dengan Css 3"

Posting Komentar