CSS3 gradient cross browser
เราสามารถสร้างพื้นหลังแบบ gradient ได้โดยไม่ต้องใช้รูปภาพ โดยใช้คำสั่ง ของ CSS3 แต่เนื่องจากบราวเซอร์แต่ละยี่ห้อ มีคำสั่งที่ไม่เหมือนกัน มาลองเรียนรู้การแสดง gradient ด้วย CSS กันดู
background-color:#ccc;
background:-webkit-gradient(linear, left top, left bottom, from(#ccc), to(#000));
background:-moz-linear-gradient(top, #ccc, #000);
background:-o-linear-gradient(top, #ccc, #000);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#cccccc, endColorstr=#000000);
-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#cccccc, endColorstr=#000000)";
background-color:#ccc;
background: -webkit-gradient(linear, left top, right top, from(#ccc), to(#000));
background: -moz-linear-gradient(left, #ccc, #000);
background:-o-linear-gradient(top, #ccc, #000);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#cccccc, endColorstr=#000000, GradientType=1);
-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#cccccc, endColorstr=#000000, GradientType=1)";