溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

canvas繪制字體-屬性設置3

發(fā)布時間:2020-07-15 01:30:17 來源:網(wǎng)絡 閱讀:305 作者:素顏豬 欄目:開發(fā)技術

效果圖

canvas繪制字體-屬性設置3

html結構

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<title>canvas27</title>

<link rel="stylesheet" href="">

</head>

<body>

<canvas id="canvas" style ="border:1px solid #aaa;diplay:block;margin:50px auto;">

當前瀏覽器不支持canvas,請更換瀏覽器后再試

</canvas>

</body>

</html>

js腳本

<script>

window.onload = function(){

var canvas = document.getElementById("canvas");

canvas.width  = 800;

canvas.height = 800;


context = canvas.getContext("2d");


context.fillStyle = "#058";


context.font = "xx-small sans-serif";

context.fillText("歡迎學習",40,100);


context.font = "x-small sans-serif";

context.fillText("歡迎學習",40,200);


context.font = "medium sans-serif";

context.fillText("歡迎學習",40,300);


context.font = "large sans-serif";

context.fillText("歡迎學習",40,400);

context.font = "x-large sans-serif";

context.fillText("歡迎學習",40,500);


context.font = "xx-large sans-serif";

context.fillText("歡迎學習",40,600);

}


</script>

canvas繪制字體-屬性設置3

向AI問一下細節(jié)

免責聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權內(nèi)容。

AI