今天我要向你展示一段我學(xué)習(xí)HTML5時(shí)寫(xiě)的一個(gè)小小的心表白代碼，希望你會(huì)喜歡！
<!DOCTYPE html>
<html>
<head>
<title>我的心意</title>
</head>
<body>
<canvas id="myCanvas" width="200" height="200"></canvas>
<script>
var canvas = document.getElementById("myCanvas");
var context = canvas.getContext("2d");
context.fillStyle = "pink";
context.strokeStyle = "#000";
context.lineWidth = 2;
context.beginPath();
context.moveTo(100, 50);
context.bezierCurveTo(100, 30, 60, 20, 50, 50);
context.bezierCurveTo(40, 20, 0, 30, 0, 60);
context.bezierCurveTo(0, 90, 50, 120, 100, 150);
context.bezierCurveTo(150, 120, 200, 90, 200, 60);
context.bezierCurveTo(200, 30, 160, 20, 150, 50);
context.bezierCurveTo(140, 20, 100, 30, 100, 50);
context.fill();
context.stroke();
context.font = "30px Arial";
context.fillStyle = "#000";
context.fillText("我喜歡你", 40, 180);
</script>
</body>
</html>這段代碼使用了HTML5中的canvas標(biāo)簽，通過(guò)JavaScript在畫(huà)布上繪制一個(gè)心形，并使用fill()方法填充顏色，stroke()方法劃線(xiàn)，text()方法添加文字。
通過(guò)HTML5，我們可以更加簡(jiǎn)單、快速地實(shí)現(xiàn)頁(yè)面效果，并且擁有更強(qiáng)大的跨平臺(tái)和兼容性支持。我相信，在未來(lái)，HTML5將會(huì)更加普及和廣泛應(yīng)用于各個(gè)領(lǐng)域。
上一篇html5快閃代碼
下一篇html5快捷方式代碼