Canvas是HTML5標(biāo)準(zhǔn)中新增的一個(gè)元素，通過(guò)JavaScript編程實(shí)現(xiàn)在網(wǎng)頁(yè)上繪制圖形、動(dòng)畫和游戲等。

使用Canvas可以實(shí)現(xiàn)非常豐富的視覺效果，但有時(shí)候我們發(fā)現(xiàn)在CSS文件中修改Canvas的樣式卻不起作用。

canvas {
width: 500px;
height: 500px;
border: 1px solid black;
}

上面的代碼是給Canvas設(shè)置寬度、高度以及邊框，但是在實(shí)際運(yùn)行時(shí)并沒有任何效果。

這是因?yàn)镃anvas是一個(gè)通過(guò)JavaScript動(dòng)態(tài)繪制的元素，CSS樣式對(duì)其并沒有任何作用。想要修改Canvas的樣式，需要直接在JavaScript中操作：

var canvas = document.getElementById("myCanvas");
canvas.style.width = "500px";
canvas.style.height = "500px";
canvas.style.border = "1px solid black";

通過(guò)以上代碼，我們成功的給Canvas設(shè)置了樣式。

因此，在操作Canvas樣式時(shí)，我們需要注意，CSS樣式對(duì)其無(wú)效，只能通過(guò)JavaScript操作。