整合營(yíng)銷(xiāo)服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
頁(yè)中添加滾動(dòng)字幕效果
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>滾動(dòng)字體的設(shè)置</title>
</head>
<body>
<canvas id="canvas1" width="600" height="600" style="border:1px solid #000000"></canvas>
<script type="text/javascript">
var canvas1 = document.querySelector("#canvas1") // 1.找到畫(huà)布對(duì)象
var ctx = canvas1.getContext("2d") // 2.上下文對(duì)象（畫(huà)筆）
ctx.shadowBlur = 10; // 陰影距離
ctx.shadowColor = "red" // 陰影顏色
ctx.shadowOffsetX = 30 // 陰影偏移
ctx.shadowOffsetY = 30 // 陰影偏移
ctx.font = "150px 楷體"
ctx.fillText("你好！", 20,150)
ctx.fillText("你好！", 20,350)
ctx.strokeText('你好！',23, 153)
ctx.strokeText('你好',23, 553)
canvas繪制文字
var x = 600
setInterval(function(){
if(x > -350){
//清空畫(huà)布
ctx.clearRect(0,0,600,600)
ctx.strokeText('你好！',x, 153)
ctx.fillText("你好！", x,350)
ctx.font = "50px 宋體"
ctx.strokeText('每天學(xué)習(xí)一點(diǎn)點(diǎn)',x, 553)
x -= 3
}else{x=590}
}, 16)
</script>
</body>
</html>
ont 屬性可以用來(lái)作為 font-style, font-variant, font-weight, font-size, line-height 和 font-family 屬性的簡(jiǎn)寫(xiě)，或?qū)⒃氐淖煮w設(shè)置為系統(tǒng)字體。
font-family寫(xiě)法示例：
<style>
p{
font-family: "幼圓";
}
</style>
</head>
<body>
<p>19級(jí)啟嘉班</p>
</body>效果：
*請(qǐng)認(rèn)真填寫(xiě)需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。
