댓글 : HTML5는 그라디언트 배경 사진을 그릴 수 있으며 자동으로 다운로드 할 수 있습니다. 다음은 모든 사람을위한 상세한 단계입니다. 좋아하는 친구는 그것을 놓치지 않아야합니다.
drawbgline.html<! doctype html>
<헤드>
<meta charset = "utf-8"/>
<title> html5는 그라디언트 배경 사진을 그리고 자동으로 다운로드 </title>입니다
</head>
<body>
<centre>
<canvas>/canvas>
</센터>
<cript>
// 1 단계 : 캔버스 개체를 가져옵니다
var c = document.getElementById ( "c");
// 2 단계 : 캔버스 개체의 컨텍스트 개체 가져 오기
var context = c.getContext ( "2d");
/*
* 이들은 다른 그래픽 코드를 그립니다
context.beginpath ();
context.linewidth = 10;
context.strokestyle = "빨간색";
Context.Moveto (50,50);
Context.lineto (150,50);
Context.Stroke ();
context.closepath ();
//context.strokerect(220,50,50,50);
Context.FillStyle = "Blue";
context.fillRect (220,50,50,50);
context.beginpath ();
context.arc (150,150,50,0*Math.pi/180, -180*Math.pi/180, False);
Context.lineto (150,150);
context.closepath ();
Context.Stroke ();
context.linewidth = 1;
context.font = "50px songyi";
context.fillText ( "브립", 0,220);
context.save ();
컨텍스트. 트랜스 슬레이트 (50,50);
Context.rotate (90*Math.pi/180);
context.beginpath ();
context.linewidth = 10;
context.strokestyle = "빨간색";
Context.Moveto (0,0);
Context.lineto (100,0);
Context.Stroke ();
context.closepath ();
Context.Restore ();
*/
var g = context.createlineargradient (0,0,0,200);
g.addcolorstop (0, "90bfff");
g.addcolorstop (1, "흰색");
Context.fillStyle = g;
context.fillRect (0,0,1,200);
wind
</스크립트>
</body>