这样可以吗

首页课程实战体系课手记专栏慕课教程

这样可以吗

来源：7-7 编程练习

unbreakable_全栈

2020-09-28 17:23:27

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8" />

<title>Document</title>

<style>

canvas {

background-color: #000;

opacity: 0.7

}

</style>

</head>

<body>

<canvas id="canvas" width="1200px" height="1000px">

您的浏览器不支持canvas

</canvas>

<script>

var canvas = document.getElementById("canvas");

var context = canvas.getContext("2d");

// 在此处补充代码

context.shadowOffsetX = 10

context.shadowOffsetY = 10

context.shadowColor = 'rgba(237,237,91,0.5)'

context.shadowBlur = 10

context.fillStyle = '#eded5b'

context.arc(100, 100, 30, 0, Math.PI * 2, true)

context.fill()

context.beginPath()

// 山峰

context.lineWidth = 10

context.strokeStyle = '#596397'

context.shadowOffsetX = 10

context.shadowOffsetY = 10

context.moveTo(0, 1000);

context.quadraticCurveTo(100, 100, 200, 1000);

context.stroke();

context.beginPath();

context.moveTo(150, 1450);

context.quadraticCurveTo(100, 100, 500, 1000);

context.stroke();

context.beginPath();

context.moveTo(500, 1000);

context.quadraticCurveTo(500, 10, 800, 1000);

context.stroke();

context.beginPath();

context.moveTo(700, 1000);

context.quadraticCurveTo(1000, 15, 1330, 1500);

context.stroke();

// 山高月小

context.beginPath();

var str = '山高月小'

context.fillStyle = '#fff'

context.font = '50px snas-serif'

context.shadowOffsetX = 10

context.shadowOffsetY = 10

context.shadowColor = "rgba(255,255,255,0.9)";

context.shadowBlur = "10";

context.fillText(str, 600, 200)

</script>

</body>

</html>

写回答

1回答

好帮手慕码

好帮手慕码

2020-09-28

已采纳

同学你好，效果是正确的。按照效果图，可以再优化下文字：

祝学习愉快~

0

0 学习 · 6815 问题

相似问题

老师，这样可以吗？颜色不一样呢

回答 2

这样可以吗

回答 2

老师，我这样写可以吗？

回答 1

这样可以吗

回答 1

这样可以吗

回答 1

打开慕课网App查看更多内容