推薦參考學習:《HTML5教程》
那么對于學習HTML的新手來說,可能對于這個標簽元素不太清楚。
下面我們可以通過簡單的示例,給大家介紹Canvas標簽的使用詳解。
canvas繪制簡單畫布圖形(矩形)示例代碼如下:
<!DOCTYPE> <html> <meta charset="utf-8"> <head> <title>Canvas簡單使用示例</title> <style type="text/css"> #FirstCanvas{ width: 450px; height: 300px; border: 3px solid #3262ff; background-color: #acffcb; } </style> </head> <body> <canvas id="FirstCanvas"></canvas> </body> </html>
圖形效果如下:
<canvas> 標簽只是圖形容器,我們必須要使用腳本來繪制圖形。也就是說,這個標簽通常必須要指定一個id屬性,以便我們在腳本中使用。(這個腳本通常指的是JavaScript腳本)
這里需要注意的是,在默認情況下 <canvas> 元素是沒有邊框和內(nèi)容的,所以我們需要使用 style 屬性來添加邊框width寬度 和 height 高度,然后來定義的畫布的大小.
本篇就是通過canvas標簽繪制簡單的畫布圖形,非常簡單易懂,希望對需要的朋友有所幫助!
聲明:本網(wǎng)頁內(nèi)容旨在傳播知識,若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com