筆觸顏色是一個(gè)非常自然的顏色，這樣的顏色不但能夠讓網(wǎng)站更美觀也能夠讓網(wǎng)站瀏覽起來更大氣，下面匯仁智杰網(wǎng)站建設(shè)就通過案例來給大家講解怎么通過HTML5來設(shè)置筆觸的顏色。

　　繪制一個(gè)矩形。請(qǐng)用藍(lán)色的筆觸顏色：

　　實(shí)例 1

　　繪制一個(gè)矩形。使用漸變筆觸：

　　JavaScript:

　　var c=document.getElementById("myCanvas");
　　var ctx=c.getContext("2d");

　　var gradient=ctx.createLinearGradient(0,0,170,0);
　　gradient.addColorStop("0","magenta");
　　gradient.addColorStop("0.5","blue");
　　gradient.addColorStop("1.0","red");

　　// 用漸變進(jìn)行填充
　　ctx.strokeStyle=gradient;
　　ctx.lineWidth=5;
　　ctx.strokeRect(20,20,150,100);

　　JavaScript:

　　var c=document.getElementById("myCanvas");
　　var ctx=c.getContext("2d");
　　ctx.strokeStyle="#0000ff";
　　ctx.strokeRect(20,20,150,100);

　　瀏覽器支持

　　Internet Explorer 9、Firefox、Opera、Chrome 以及 Safari 支持 strokeStyle 屬性。

　　注釋：Internet Explorer 8 以及更早的版本不支持 <canvas> 元素。

　　HTML5就是這樣能夠給你帶來很多魔幻的效果，愛上了HTML5了吧，一點(diǎn)一點(diǎn)的來了解HTML5吧。