前端html标签汇总

#博学谷IT学习技术支持#

• 单标签：

  • <hr> 水平线
  • <br> 换行

• 标题标签:

  • 

     
    • 重要程度依次递减
    • 更改 crtl+D
• 段落标签：
  • 代码：<p>内容</p>
  • 段落之间存在间隙
• 文本格式化标签:
  • 代码：
  • strong——加粗——b
  • ins——下划线——u
  • em——倾斜——i
  • del——删除——s

  • 

• 图片标签：

  • 代码：<img src="所处位置" alt="文字" title="文字">

    • 

  • src="" alt=""（替换文本，无网络时显示文字） title="" （提示文本，当鼠标悬停时显示文字） 成为标签属性
  • 注意：
    • 标签属性写在开始标签内部
    • 标签上可以同时存在多种属性
    • 属性之间以空格隔开
    • 标签名img 与属性之间必须以空格隔开
    • 属性之间没有顺序之分

• 路径:

  • 绝对路径（了解）
    • 盘符开头：D：/
    • 完整的网络地址
  • 相对路径
    • 同级目录
      • 法1:<img src="目标图片.gif">
      • 法2:<img src="./目标图片.gif"
      • ./表示当前文件夹
    • 下级目录
      • <img scr="文件夹名字/目标文件名">
      • 上级目录
        • <img scr="../目标文件名.gif">
        • ../ 表示返回上级文件夹

• 音频标签：

  • 代码：<audio scr="音频路径" controls></audio>

  • 

• 视频标签：

  • 代码：<video scr="路径" controls autoplay loop></video>

  • 

• 链接标签：
  • 代码：<a href="">提示文字</a>
  • 列表标签：
    • 无序列表
      • 无顺序之分的列表
      • 标签：
        • ul——表示无序列表的整体，用于包裹li标签
        • li——表示无序列表的每一项，用于包含每一行的内容
      • 显示特点:
        • 列表的每一项前默认显示圆点标识
      • 注意点：
        • ul标签中只允许包含li标签
        • li标签可以包含任意内容
    • 有序列表
      • 在网页中表示一组有顺序之分的列表，如:排行榜。
      • 标签：
        • ol——表示有序列表的整体，用于包裹li标签
        • li——表示有序列表的每一项，用于包含每一行的内容
      • 显示特点：
        • 列表的每一项前默认显示序号标识
      • 注意点：
        • ol标签中只允许包含li标签
        • li标签可以包含任意内容
    • 自定义列表
      • 场景：在网页的底部导航中通常会使用自定义列表实现
      • 标签：
        • dl——自定义列表的整体，用于包裹dt/dd标签
        • dt——自定义列表的主题
        • dd——自定义列表的针对主题的每一项内容