知识总结

上午：了解了HTML的发展和H5，复习了html的标签和一些知识点

下午：a标签的锚点和音视频播放，图片和复习css

CSS (Cascading Style Sheets) 用于渲染HTML元素标签的样式。

​ audio 音频标签
​ controls 控制按钮
​ autoplay 自动播放 chrome 在65之后禁止音/视频自动播放
​ muted 静音
​ preload 加载
​ auto 自动 默认
​ none 不预加载
​ metadata 预加载
​ loop 循环播放

​ video 视频控件
​ controls 控制按钮
​ poster 视频封面
​ （其他 audio 标签属性也生效）

​ 滚动字幕

<script type="text/javascript">
            // 获取 视频 元素
            var video = document.querySelector("#video");
            // 获取到 播放 按钮
            var btn = document.querySelector("#btn");
            
            // 定义一个函数
            function play(){
                // 向控制台输出
                // console.log(video);
                // 获取视频是否暂停
                var videoStatus = video.paused;
                
                
                if(videoStatus){
                    // 如果是暂停的,就播放
                    video.play();
                    // 修改按钮文字
                    btn.innerText = '暂停';
                    
                    // video.muted = true; 静音 video.volume = (0~1) 音量
                }else{
                    // 如果是暂停的,就暂停
                    video.pause();
                    // 修改按钮文字
                    btn.innerText = '播放';
                }
                
            }
            
            
            function listen(e){
                var code = e.keyCode;
                // 判断 如果是 空格或者 回车按钮 调用 play()
                if (code == 32 || code == 13) {
                    play();
                }
                
            }
            
            // 添加监听事件
            window.addEventListener("keydown", listen, false);
        </script>

心得体会

长时间没有用过前端，前端的知识点都忘记了，还需要花时间去复习一下前面的知识。基础知识巩固好，才能更好的衔接以后新学的知识点，不然，如果前面的知识没巩固好，后面学习新知识的时候就会有点困难。