文章目录
HTML标签
一、排版标签
1.标题标签
代码示例：
<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>
有一个快捷键：crtl + d 可以选中一行内的同样的文本，修改比较方便。
效果图
2.段落标签（一段一个）
最好一段一个p标签，段落之间就有间隙了。
代码示例
<body>
<h1>文章标题</h1>
<p>阿卡贝拉即无节奏伴唱.起源是中世纪的教会音乐，当时的教会音乐只以人声清唱，并不应用乐器。</p>
<p>"翻唱”是指将已经发表由其他人演唱的歌曲根据自己的风格重新演唱</p>
</body>
效果：
3.换行和水平线标签
换行标签
水平线标签
示例:
<body>
<h1>文章标题</h1>
<hr>
<p>阿卡贝拉即无节奏伴唱。<br>起源是中世纪的教会音乐，当时的教会音乐只以人声清唱，并不应用乐器。</p>
<p>"翻唱”是指将已经发表由其他人演唱的歌曲根据自己的风格重新演唱</p>
</body>
效果：
二、文本格式化标签
左右没什么区别，用户眼里的效果都是一样的。老师说右边一列表示的强调语义更强烈，但是只要程序员看得懂的话哪个都可以。
示例：
<body>
<b>加粗</b>
<strong>加粗</strong>
<u>下划线</u>
<ins>下划线</ins>
<i>倾斜</i>
<em>倾斜</em>
<s>删除</s>
<del>删除</del>
</body>
效果：
三、媒体标签
1.图片标签
标签完整结构图：
属性注意点：
1.标签的属性写在开始标签内部。
2.标签上可以同时存在多个属性。
3属性之间需要用空格隔开。
4.标签名与属性之间必须用空格隔开。
5.属性间没有顺序之分。
关于图片标签的属性
路径属性：
替换文本：
title属性：
width和height属性：
<body>
<!-- alt属性 替换文本 -->
<!-- title属性 提示文本 -->
<!-- width和height属性 只需要给出一个值，另一个等比例缩放 -- 好处是文本不变形-->
<!-- 放在一个文件夹里的话，src的""里直接写图片名就可以 -->
<img src="cat.gif" alt="这是一只猫" title="这是title文字，鼠标悬停的时候显示" width="200">
</body>
效果：（成功版）
失败版：
2.路径
绝对路径（了解）
相对路径（常用）
同级目录
VS Code快捷操作：敲了./之后，会自动提示同级目录中有哪些文件，直接选择即可。
下级目录
VS Code快捷操作：直接敲./后，会自动提示当前目录下有哪些文件夹，直接一层层选择即可。
上级目录
…/ 到上级目录
…/…/到上上级目录 以此类推
3.音频标签
实例：
<body>
<audio src="music.mp3" controls autoplay loop></audio>
</body>
效果：
注：Chrome不支持音频自动播放
4.视频标签
示例：
<body>
<video src="video.mp4" controls autoplay muted loop></video>
</body>
注：谷歌浏览器可以实现视频自动播放 但是需要配合muted实现静音播放（只有加了muted使其静音 才能自动播放）
效果：
四、链接标签
href属性—决定跳转到哪里
链接标签的显示特点：
target属性—决定跳转方式
开发中不确定链接最终跳转位置，使用空链接占位。
空链接：
738
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
