CSS3 Efek gradiasi ( gradient ) `

masih tetap di CSS3 , CSS3 mempermudah kita untuk mengatur dan mendesain tampilan Elemen - elemen di blog kita ,yups ,, topik kita hari ini yaitu Cara memberi efek gradiasi ( gradient ),APA ITU GRADIENT ?,,
efek gradient ini sebetulnya adalah percampuran warna , dari warna A( sisi bagian atas ) ke warna B(sisi bagian bawah ) dan menghasilkan efek yang disebut tadi yaitu gradient.efek gradient ini biasanya di pakai sebagai background atau latar belakang sebuah elemen - elemen di blog , misalnya : background menu navigasi , background Tabel ,background halaman post dan bisa di terapkan di semua elemen - elemen di blog Anda .dan sebelumnya di blognya mastony kemaren telah membahas tentang cara memberi efek bayangan , kalo belum baca silahkan baca di sini Cara memberi efek bayangan jika sudah kita bahas bersama - sama Tutotial sederhana ini yaitu tentang cara memberi efek gradiasi
kode css nya sebagai berikut :

 div.gradiasi{padding:10px;width:250px;height:150px;background:linear-gradient(#CCFF00,#ddd);background:-webkit-gradient(linear,left top,left bottom,from(#CCFF00),to(#ddd));background:-moz-linear-gradient(#CCFF00,#ddd);background:-o-linear-gradient(#CCFF00,#ddd);}</style>

penerapan html :

<div class="gradiasi">
Tulisan anda dengan background gradient Tulisan anda dengan background gradient Tulisan anda dengan background gradient Tulisan anda dengan background gradient  </div>

dan sebagai hasilnya seperti di bawah :

Tulisan anda dengan background gradient Tulisan anda dengan background gradient Tulisan anda dengan background gradient Tulisan anda dengan background gradient

memberi background pada halaman post contoh :

post-body{disini aturan css .........background:linear-gradient(#CCFF00,#ddd);background:-webkit-gradient(linear,left top,left bottom,from(#CCFF00),to(#ddd));background:-moz-linear-gradient(#CCFF00,#ddd);background:-o-linear-gradient(#CCFF00,#ddd);.........}

Note :  #CCFF00,#ddd ini adalah kode warna , silahkan anda ubah menurut template anda masing - masing.
dan sampai di sini tutorial nya , dan semoga Artikelnya bermanfaat ..

Terima kasih Anda telah membaca Artikel mengenai CSS3 Efek gradiasi ( gradient ) dan Kata kunci untuk Artikel ini yaitu CSS3 Efek gradiasi ( gradient )