文字以打字样式展现形式

实现文字以打字的形式出现

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Documenttitle>
head>
<body>
    <div >
        <span id="demo"> span><span  class="blink">span>
    div>
    <script >
        var str = "停车坐爱枫林晚，霜叶红于二月花"
	var i = 0;
	function typing(){
		var demo= document.getElementById('demo')
		if(i<=str.length){
			demo.innerHTML = str.slice(0,i++) ;
			setTimeout("typing()",200)
		}else{
			demo.innerHTML = str;
		}
	}
	typing();
    script>
    <style>
       .blink{
		display:inline-block;
		width:8px;
        height: 8px;
		-webkit-animation:blink 1.2s infinite steps(1,start);
	}
        @-webkit-keyframes blink {
	  0%, 100% {
	        background-color: #000;
	        
	  }
	  50% {
	        background-color: #bbb;
	  }
	}
	

    style>

body>
html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48

相关阅读:
【rust/egui】(十一)使用rfd选择文件并使用serde_json进行序列化
2022DASCTF7月赋能赛（复现）
m基于3GPP-LTE通信网络的认知家庭网络Cognitive-femtocell性能matlab仿真
内核编译 --- 链接器
tf.get_variable()函数
Linux调试器-gdb使用
融合微平衡激活的小孔成像算术优化算法
【mitmproxy】一、简介与快速上手
HTML5详解
SpringBoot整合Neo4j

原文地址：https://blog.csdn.net/Christina0109/article/details/134284545