首頁猿問 html5中的canvas...

html5中的canvas fillRect屬性設(shè)置為什么必須要height和width內(nèi)聯(lián)在canvas標(biāo)簽內(nèi)

Html5 JavaScript

kumin 2016-04-06 09:26:34

今天學(xué)canvas 的fillRect屬性的時候自己怎么調(diào)都不對，后來發(fā)現(xiàn)必須把height和width內(nèi)聯(lián)在canvas標(biāo)簽內(nèi)。想問問這是為什么，是什么原因?qū)е碌摹o法讓rillRect數(shù)值正確的設(shè)置方式第一種<canvas id="mycanvas" style="height:500px; width:500px;"></canvas>第二種<style>#mycanvas{height:500px; width:500px;}</style><canvas id="mycanvas"></canvas>必須是內(nèi)聯(lián)才可以為什么那網(wǎng)上也百度了一圈沒看到有解釋的。<canvas id="mycanvas" height="500px" width="500px"></canvas>

查看完整描述

2 回答

已采納

ruibin

TA貢獻358條經(jīng)驗獲得超213個贊

<canvas>有自己的默認(rèn)寬高300px*150px，而且在<canvas>中定義width、height跟在style中定義width和height是有所區(qū)別的，<canvas>標(biāo)簽的width和height是繪畫區(qū)域?qū)嶋H寬度和高度，繪制的圖形都是在這個上面。而style的width和height是<canvas>在瀏覽器中被渲染的高度和寬度。如果<canvas>中沒有直接定義width和height沒或值不正確，就被設(shè)置成默認(rèn)值{width:300px，height:150px}。所以，即使你在style中設(shè)置了canvas {width: 200px; height: 200px;}，此時你輸出canvas.height 值依舊為150，canvas.width值依舊為300.這和一般標(biāo)簽?zāi)悴辉O(shè)就就為undefined不同的。

1 反對回復(fù) 2016-04-06