解決在HTML中canvas圖層一直在最上層問題

解決在HTML中canvas圖層一直在最上層問題

問題

在用canvas做動畫效果時，會把之前的頁面內容遮擋，用position:relative; z-index:-1"也沒辦法解決；

<canvas class="main-canvas" id="main-canvas"></canvas>

 解決

在canvas套上div盒子，在div中設置position:relative; z-index:-1"，來把canvas的層級降低。

<div style="position:relative; z-index:-1"  >
    <canvas class="main-canvas" id="main-canvas"></canvas>
</div>