如何用H5改變圖形樣式
HTML5標簽除了增添繪圖功能我們可以在網頁中輸出圖片和動畫外，還可以為圖片和動畫元素添加一些屬性，來改變圖片和場景樣式，如圖片的變化效果等，下面就讓我們一起動手吧！
工具/材料
dw等代碼編輯軟件
操作方法
-
01
先在HTML5頁面主體里面添加一個<canvas>標簽，定義一張畫布（大小，背景顏色）代碼如圖1；
-
02
在html5的頭部嵌入JS代碼，并把畫布加載到頁當中去；如圖2
-
03
運行程序，這樣我們就可以看到一張剛才定義好的畫布了，如圖3
-
04
在起點為（50，50）至（200，400）的地方劃一條斜線，顏色為紅色，如圖4
-
05
運行代碼，這時候會發現，畫布里面多了一條劃線，如圖5
-
06
在端點為（50，200）的地方在添加一條斜線，線的精細為10，如圖6
-
07
運行程序，如圖7
-
08
通過linejoin的三種屬性“miter、round、bevel”可以把兩條線的端點變為尖角、圓角、鈍角，代碼如圖8（變為圓角）
-
09
運行程序，如圖9（怎么樣，你看到小圓角了嗎？）
- End
- 發表于 2017-10-23 00:00
- 閱讀 ( 701 )
- 分類：電腦網絡
admin
0 篇文章
作家榜 ?
-
xiaonan123
189 文章
-
湯依妹兒
97 文章
-
luogf229
46 文章
-
jy02406749
45 文章
-
小凡
34 文章
-
Daisy萌
32 文章
-
我的QQ3117863681
24 文章
-
華志健
23 文章