B站《前端Web开发HTML5+CSS3+移动web视频教程，前端web入门首选黑马程序员》
第一天的课程
一、hr元素
1.定义
<hr> 标签用于在 HTML 页面中创建一条水平分隔线。
二、video元素
1.定义
<video> 标签定义视频，比如电影片段或其他视频流。
2.属性
3.支持格式说明
三、audio元素
1.定义
<audio> 标签定义声音，比如音乐或其他音频流。
2.属性
3.支持格式说明
#### 第一天课程案例
html
<!DOCTYPE html>
<html>
<head>
<title>魏无羡简历</title>
<meta charset=""utf-8">
<meta name="viewport" content="width=device-width, intial-scale=1.0">
</head>
<body>
<h1>魏婴</h1>
<hr>
<p>魏婴，字无羡。鬼道创始者，人称夷陵老祖。丰神俊朗，潇洒不羁。身形纤长，身着黑衣，腰间佩笛，笛尾悬穗。</p>
<img alt="魏无羡图片" src="https://bkimg.cdn.bcebos.com/pic/4d086e061d950a7b02081fb5ae9b75d9f2d3572c6325?x-bce-process=image/format,f_auto/watermark,image_d2F0ZXIvYmFpa2UyNzI,g_7,xp_5,yp_5,P_20/resize,m_lfit,limit_1,h_1080" height="400px">
<h3>主要经历</h3>
<p>温氏作乱期间修得鬼道归来，射日之征中杀敌数千。因保护无辜之人受百家敌视。在百家围剿中因百鬼反噬而死。十三年后被献舍而得以重生。后再与蓝忘机结伴而行，两人互通心意，终成眷属。</p>
<h3>主要技能</h3>
<p>佩剑随便，法器陈情。法宝召阴旗。正统仙剑，剑鞘古朴，剑身雪白笔直。
胜在轻灵奇巧，弱在力量不足。御剑飞行，打怪兽，切西瓜。鬼笛陈情，威名远扬。
笛身漆黑光亮，笛尾系着鲜红的穗子。
笛声有如天人之音。笛声御尸
纵鬼兵鬼将如千军万马。</p>
<h3>奖项荣誉</h3>
<p><strong>国风合伙人</strong>：中国科举博物馆拥有悠久的历史和丰富的文化底蕴。跨界推出虚拟偶像魏无羡来担任"国风合伙人"，传统文化和二次元IP共同发力，深层挖掘文创市场，多样化开发IP价值。而虚拟偶像魏无羡推广传承传统文化的同时，也使这个人物形象有了新的意义和文化厚度。传统文化中善良仁爱的品德、持重内敛的气度和豁达的人生态度，都可以被这一虚拟形象一一展现。同样年少轻狂，同样内心温暖、向往美好，魏无羡令当代年轻人更有代入感。</p>
<video type="video/mp4" src="https://www.bilibili.com/video/BV14S4219778?t=4.6" autoplay muted
controls>360度绕婴式打法</video>
</body>
</html>效果图
