Komentar: Tutorial HTML5 menyadari efek warna gradien dari Photoshop, silakan merujuknya
<! Doctype html> <head>
<Meta Charset = UTF-8>
<title> HTML5 Garis gambar, lingkaran, persegi panjang </iteme>
<skrip src = "<a href =" http://ajax.googleapis.com/ajax/libs/jQuery/1.7.1/jquery.min.js "> </skrip"> "> </skrip </a>>
</head>
<script>
$ (dokumen) .ready (function () {
var c = document.geteLementById ("drawbox");
var draw = c.getContext ("2d"); // Dapatkan referensi ke konten 2D, panggil gambar gambar API </p> <p> // tentukan blok gradien
var grd = draw.createLineArgradient (50,50,200,50); // koordinat, panjang dan lebar
grd.addcolorstop (0, "hitam"); // Mulai warna
grd.addcolorstop (1, "hijau"); // warna titik akhir </p> <p> draw.fillstyle = grd; // set sebagai gaya pengisian
draw.fillrect (50,50.200,50); // Isi ke dalam persegi panjang
})
</script>
</body>
<Canvas> </an Canvas>
</body>
</html>
Gambar reproduksi: