我希望颜色随绘制的每个正方形而变化。 也许与rgb有关?但是我真的很陌生,所以我真的不知道哈哈。
不知道还能尝试什么。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>IDK</title>
<style>
body {
background-color:rgb(30, 30, 30);
color:White;
}
</style>
</head>
<body>
<h2>IDK</h2>
<canvas id="minCanvas" width="600" height="600"></canvas>
<script>
var canvas = document.getElementById("minCanvas");
var ctx = canvas.getContext("2d");
var side=600;
var x=0;
var y=0;
var a = 255;
var b = 255;
var c = 255;
while (side>0) {
ctx.strokeStyle = "rgb(a,b,c)";
ctx.strokeRect(x, y, side, side);
//ctx.stroke();
a-=50;
b-=10;
c-=30;
x+=5;
y+=5;
side-=10;
}
</script>
</body>
</html>
答案 0 :(得分:0)
您必须将变量明确插入到rgb字符串中:
while ( i < MAX_INPUT_LINES && fgets(string, 1000, file_1)!= NULL)
如果受支持,您还可以使用模板字符串:
ctx.strokeStyle = "rgb("+a+","+b+","+c+")"
ctx.strokeStyle = `rgb(${a},${b},${c})`
var canvas = document.getElementById("minCanvas");
var ctx = canvas.getContext("2d");
var side=600;
var x=0;
var y=0;
var a = 255;
var b = 255;
var c = 255;
while (side>0) {
ctx.strokeStyle = "rgb("+a+","+b+","+c+")";
ctx.strokeRect(x, y, side, side);
//ctx.stroke();
a-=50;
b-=10;
c-=30;
x+=5;
y+=5;
side-=10;
}
body {
background-color:rgb(30, 30, 30);
color:White;
}