HTML基础标签（持续更新）

#2022年11月30日

1.Web标准：HTML、CSS、JS（重点）

• HTML：页面元素
• CSS: 修饰样式和美化页面
• JS: 负责页面的交互行为

2.注释（便于其他程序员观看自己的代码）

• 快捷键 —— ctrl+/

3.HTML标签的结构

• 开始标签 + 内容 + 结束标签（双标签）
• 单标签 例如 <br/>

4.标签间关系 父子和兄弟关系

• 父子关系：
  <head/>
  <title></title>
</head>
• 兄弟关系
  <div></div>
<div></div>

5.标签详解

1. 标题标签
    h1~h5 ： 逐渐字体变小 ,文字加粗，独占一行

2. 段落标签
   p标签 ：段落之间默认缝隙，独占一行

3. 换行标签
   br 单标签

4. 水平分割线标签
   hr 单标签

5. 文本格式化标签
   加粗—— <b/>或者<string/>
   下划线——<u/>或者<ins/>
   倾斜——<i/>或者<em/>
   删除线——<s>或者<del/>

6. 媒体标签
   6.1 图片标签
    img 标签——src和alt必备属性（属性之间没有顺序）
    可选属性：title（提示文本，鼠标悬停时显示）、width和height（宽和高-写一个自动等比例缩放）

6.2 路径
   相对路径(从当前文件出发寻找目标文件)
     同级别——直接写文件名或者./加文件名
     下级别——./img/(目标文件名)
     上级别——../到上级目录
   绝对路径(通常从盘符出发 - D:\day01\img\new.jpg)

6.3 音频标签
   audio标签——src
   可选属性：controls（显示播放音频控件）、autoplay（自动播放，并不是所有浏览器都支持）、loop（循环播放）

6.4 视频标签
   video标签——src（指定视频路径）
   可选属性：controls（显示播放音频控件）、autoplay（自动播放，谷歌浏览器配合muted实现静音播放）、loop（循环播放）

7. 链接标签
   a 标签——href属性（代表路径）
   可选属性——target（是否在当前窗口跳转 _self在当前窗口，_blank在新窗口）、

8. 列表标签
   8.1 有序列表
    <ol/>
   <li>香蕉</li>
   <li>苹果</li>
 </ol>
   8.2 无序列表
    <ul/>
   <li>香蕉</li>
   <li>苹果</li>
 </ul>
   8.3 自定义列表
    <dl/>
   <dt>帮助中心</dt>
   <dd>关于我们</dd>
 </dl>

9. 表格标签
   table标签
    <table/>
   <tr>
       <td>姓名</td>
       <td>成绩</td>
   </tr>
 </table>
   可选属性——border（每个格子是否有边框）