HTML5 canvas坐標(biāo)
在canvas當(dāng)中有一個(gè)特殊的東西叫做“坐標(biāo)”!沒(méi)錯(cuò),就是平時(shí)所熟知的坐標(biāo)體系。canvas擁有自己的坐標(biāo)體系,從最上角0, 0開(kāi)始,X向右是增大,Y向下是增大。也可以借助CSS當(dāng)中的盒子模型的概念來(lái)幫助理解。
盡管canvas元素功能非常強(qiáng)大,用處也很多,但在某些情況下,如果其他元素已經(jīng)夠用了,就不 應(yīng)該再使用canvas元素。例如,用canvas元素在HTML頁(yè)面中動(dòng)態(tài)繪制所有不同的標(biāo)題,就不如直 接使用標(biāo)題樣式標(biāo)簽(H1、H2等),必定它們與canvas元素實(shí)現(xiàn)的效果是一樣的。
在訪問(wèn)頁(yè)面的時(shí)候,如果瀏覽器不支持canvas元素,或者不支持HTML5 canvas API中的某些 特性,那么開(kāi)發(fā)人員最好提供一份替代代碼。例如,開(kāi)發(fā)人員可以通過(guò)一張?zhí)娲鷪D片或者一些說(shuō)明性的 文字告訴訪問(wèn)者:使用最新的瀏覽器可以獲得更佳的瀏覽效果。下列代碼展示了如何在canvas中指定 替代文本,當(dāng)瀏覽器不支持canvas的時(shí)候,會(huì)顯示這些替代內(nèi)容,代碼如下:
<canvas>
Update your browser to enjoy canvas!
</canvas>
除了上面代碼中的文本外,同樣可以使用圖片。不論是文本,還是圖片,都會(huì)在瀏覽器不支持 canvas元素的情況下顯示出來(lái)。
提供替代圖像或替代文本引出了可訪問(wèn)性這個(gè)話題。很遺憾,這是HTML5 canvas規(guī)范中明顯的缺陷。例如,沒(méi)有一種原生方法能夠自動(dòng)為已插入到canvas中的圖片生成用于替換的文字說(shuō)明。同樣,也沒(méi)有原生方法可以生成替代文字以匹配由canvas Text API動(dòng)態(tài)生成的文字。暫時(shí)還沒(méi)有其他方法可以處理canvas中動(dòng)態(tài)生成的內(nèi)容,不過(guò)已經(jīng)有工作組開(kāi)始著手這方面的設(shè)計(jì)了,讓我們一起期待吧。
點(diǎn)擊加載更多評(píng)論>>