轉載地址：https://forum.cocos.com/t/creator-canvas/55373/14
-
Creator 版本：1.7
-
目標平台：WEB MOBILE
項目需要，頁面做了多個Canvas，不同的Canvas可以調整Css的zIndex來調整渲染層級關系：
不過cocos自帶的Canvas底層會蓋着一層黑色的顏色，怎么去掉？
截這些圖就為了說明
cc.find('Canvas').active = false;
執行之后，依然有一層黑顏色遮蓋到cocos引擎的Canvas里面，我就想把這個黑色給替換成透明顏色，請問怎么做到？
-
Canvas放一個透明的背景，然后把cocos的canvas標簽的背景顏色設置為 然后再試試
試過了，不行
http://docs.cocos.com/creator/api/zh/enums/macro.html?h=cc.game21
在cc.game.run 開始之前cc.macro.ENABLE_TRANSPARENT_CANVAS = true; 最好打包后再main.js 里面加，過不過我沒試過，我想應該是這樣的
試過了，沒效果
直接改的打包后的main.js
Canvas設置了透明度嗎？
不改透明度，可以顯示Canvas后面的dom元素才能實現比較好的效果
沒有，這個是根據cocos里面的這個位置node節點的透明度來決定的，我在里面有個背景遮罩，有0.2的透明度
你把body的背景色去掉，如果Canvas透明了，那么整個頁面應該是白色的
當你設置了
為true后，在繪制區域有透明度的地方可以看到后面的div元素
不加cc.macro.ENABLE_TRANSPARENT_CANVAS = true;
這個透明效果就出不來嗎？
經過多次實驗，Canvas模式下，
cc.game.run(option, onStart);
之前
cc.macro.ENABLE_TRANSPARENT_CANVAS = true;
成功露出了cocos 自帶的Canvas下的其他dom元素
在WebGL模式下，渲染層級在最上面的Node需要開啟opacity = 1，同時設置
則此node內的范圍都會露出底層的其他dom元素，同時node之外的內容被裁切掉了
感謝kkk_barron同學的支持，結帖撒花~
根據樓主測試結果，
在cc.game.run之前設置cc.macro.ENABLE_TRANSPARENT_CANVAS = true;，
然后cc.director.setClearColor(new cc.Color(0,0,0, 0));，這樣在canvas和webGL下都正常使用。
因為我是VideoPlayer組件播放視頻，實現跳過按鈕，所以我還設置了VideoPlayerElement的zIndex = -1
我來做一個總結吧:
1、修改
C:\CocosCreator\resources\static\preview-templates\boot.js
C:\CocosCreator\resources\static\build-templates\shares\main.js
"""
cc.macro.ENABLE_TRANSPARENT_CANVAS = true;
cc.game.run(option, function () {
cc.director.setClearColor(new cc.Color(0,0,0, 0));
"""
2、修改CSS
C:\CocosCreator\resources\static\preview-templates\style.css
C:\CocosCreator\resources\static\build-templates\shares\style-mobile.css
body和.wrapper中的background-color改為如下：
background-color: transparent; /*設置透明*/