小编给大家分享一下HTML5如何实现Photoshop渐变色效果,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧! 代码如下: <!DOCTYPE html><head&
小编给大家分享一下HTML5如何实现Photoshop渐变色效果,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!
代码如下:
<!DOCTYPE html><head>
<meta charset=utf-8>
<title>HTML5画线、圆、矩形</title>
<script src="<a href="Http://ajax.Googleapis.com/ajax/libs/Jquery/1.7.1/jquery.min.js"></script">http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script</a>>
</head>
<script>
$(document).ready(function(){
var c=document.getElementById("drawbox");
var draw=c.getContext("2d"); //获取2d内容的引用,调用绘图API</p><p>//指定渐变区块
var grd=draw.createLinearGradient(50,50,200,50); //坐标,长宽
grd.addColorStop(0,"black"); //起点颜色
grd.addColorStop(1,"green"); //终点颜色</p><p>draw.fillStyle=grd; //设为填充样式
draw.fillRect(50,50,200,50); //填充进矩形内
})
</script>
</body>
<canvas id="drawbox" width="500" height="500"></canvas>
</body>
</html>
看完了这篇文章,相信你对“html5如何实现Photoshop渐变色效果”有了一定的了解,如果想了解更多相关知识,欢迎关注编程网node.js频道,感谢各位的阅读!
--结束END--
本文标题: html5如何实现Photoshop渐变色效果
本文链接: https://www.lsjlt.com/news/89642.html(转载时请注明来源链接)
有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
下载Word文档到电脑,方便收藏和打印~
2022-06-04
2022-06-04
2022-06-04
2022-06-04
2022-06-04
2022-06-04
2022-06-04
2022-06-04
2022-06-04
2022-06-04
回答
回答
回答
回答
回答
回答
回答
回答
回答
回答
0