SAS - Suminah

Membuat baground gradient, pasti anda sudah tahu dengan yang di namakan baground gradient. Buat anda yang belum tahu anda bisa lihat contohnya pada tombol "search" di kotak pencarian diatas. Pada tombol tersebut menggunakan gradient dari atas ke bawah dengan warna merah ke putih.

Cara pembuatannya silahkan simpan kode kode di bawah ini:

• CSS Gradient Atas ke Bawah 

background:-moz-linear-gradient(100% 100% 90deg, #2F2727, #1a82f7);
background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#1a82f7), to(#2F2727));
background:-webkit-linear-gradient(#2F2727, #1a82f7);
background:-o-linear-gradient(#2F2727, #1a82f7); 

• CSS Gradient Kiri ke Kanan

background:-moz-linear-gradient(left, #2F2727, #1a82f7);
background:-webkit-gradient(linear, left top, right top, from(#1a82f7), to(#2F2727));
background:-webkit-linear-gradient(left, #2F2727, #1a82f7);
background:-o-linear-gradient(left, #2F2727, #1a82f7);

• CSS Gradient dengan Color Stop

background:-moz-linear-gradient(left, #2F2727, #1a82f7, #2F2727, #1a82f7, #2F2727);
background:-webkit-gradient(linear, left top, right top, from(#2F2727), color-stop(0.25, #1a82f7), color-stop(0.5, #2F2727), color-stop(0.75, #1a82f7), to(#2F2727));
background:-webkit-linear-gradient(left, #2F2727, #1a82f7, #2F2727, #1a82f7, #2F2727);
background:-o-linear-gradient(left, #2F2727, #1a82f7, #2F2727, #1a82f7, #2F2727);

• CSS Gradient dengan Arbritary Stop Spesifik

background:-moz-linear-gradient(left, #2F2727, #1a82f7 5%, #2F2727, #1a82f7 95%, #2F2727);
background:-webkit-gradient(linear, left top, right top, from(#2F2727), color-stop(0.05, #1a82f7), color-stop(0.5, #2F2727), color-stop(0.95, #1a82f7), to(#2F2727));
background:-webkit-linear-gradient(left, #2F2727, #1a82f7 5%, #2F2727, #1a82f7 95%, #2F2727);
background:-o-linear-gradient(left, #2F2727, #1a82f7 5%, #2F2727, #1a82f7 95%, #2F2727);

Itulah beberapa scrypt pembuatan  baground gradient atau gradasi, cara penggunaannya sangat mudah letakkan asrypt diatas pada bagian bagroend blog anda atau widget anda. contohnya seperti dibawah ini.

Misalkan anda akan membuat baground blog anda menjadi gradasi, Masuk ke edit html => body
setelah ketemu masukkan kode diatas setelah body

body {background:-moz-linear-gradient(100% 100% 90deg, #2F2727, #1a82f7);
background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#1a82f7), to(#2F2727));
background:-webkit-linear-gradient(#2F2727, #1a82f7);
background:-o-linear-gradient(#2F2727, #1a82f7); }

Untuk Kode warnanya klik disini

semoga bermanfaat, sumber masdoyok