Friday, April 17, 2015

Gradient Background dengan css

Dengan css3 kita dapat membuat perubahan yang lebih halus antara 2 warna atau lebih. Saya akan terapkan trik tersebut untuk membuat background gradien, yak kita akan membuat linear gradien dengan 3 warna trik ini juga bisa diterapkan ke dalam blog kita,

baiklah langsung saja kita mulai....

  • Buka notepad dan paste kan kode berikut

<html>
<style>
body{
    height:500px;
    background: -webkit-linear-gradient(#2a495d, #d2d69e,#ffffff); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#2a495d, #d2d69e,#ffffff); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#2a495d, #d2d69e,#ffffff); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#2a495d, #d2d69e,#ffffff); /* Standard syntax (must be last) */
    background-repeat: no-repeat;
}
</style>
<body>
contoh gradient background 3 warna dengan css3
</body>
</html>


  • Simpan file tersebut dengan format html
  • Buka file tersebut dengan browser
cukup sekian trik kali ini semoga bermanfaat..



Artikel Terkait