什么是HTML标签

一.HTML注释

1.什么是注释:代码的解释说明
2.加注释快捷键:Ctrl+/
3.注释的作用:增加代码可读性,方便其他人,也方便自己读懂代码

二.HTML标签

1.标签的组成(单标签,双标签)

​ 由<>/英文符号组成,有单标签和双标签.双标签可以包裹内容,单标签不可.

2.标签的关系

​ ①父子关系(嵌套关系)

​ ②兄弟关系(并列关系)

3.标签学习路径

(1)排版标签:标题,段落,换行,水平线

​ ①标题标签:< h1>< /h1>…< h6>< /h6>
标题标签一共有六种,从1到6,字号越来越小,级别越来越低.

​ ②段落标签:< p>< /p>
用于包裹网页的段落内容,例如文章的内容.

​ ③换行标签(单标签):< br>
单标签,当它加在其他标签下方时,实现强制换行.

​ ④分隔符标签(单标签):< hr>

(2)文本格式标签:加粗,下划线,倾斜,删除键

​ 右表比左表更具强调意义,在项目中优先选择语义化标签.

(3)媒体标签:图片,路径,音频,视频

​ ①图片标签(单标签):< img src=“” alt=“” title=“” width=“” height=“”>

​ src=““是标签属性,src叫属性名,”“中的内容叫属性值.(图片资源与图片资源在一个路径下,同一文件夹里用”./”+图片名表示)标签上可以有多个属性,属性之间空格隔开,属性之间没有顺序之分.

​ alt=""的属性值是替换文本.当src的属性值无法显示时显示alt的属性值.

​ title=""的属性值是提示文本,当鼠标悬停时所显示的内容.

​ width和height设置图片的宽和高.如果只设置一个,另一个会自动动比例缩放.

​ ②路径(分为绝对路径和相对路径)

​ 绝对路径:目录下的绝对路径,可直接到达目标位置,通常从盘符开始.(网址和盘符地址都是绝对路径)

​ 相对路径(同级目录,上级目录,下级目录):从当前文件开始出发找目标文件的过程.开发中一般使用相对路径.

​ 同级目录:目标文件在同一个目录中

​ 下级目录:

​ 上级目录(往上返一级:“…/”):

​ ③音频标签:< audio src=“” controls autoplay loop> < /audio>
​ 常见属性如下,音频标签目前支持三种格式(MP3,wav,ogg)

​ ④视频标签:< video src=“” >包裹内容无法显示 < /video>
​ 常见属性如下:(< video src=" " autoplay controls muted>< /video> 实现静音自动播放)

(4)链接标签(超链接是唯一自带颜色的标签):

​ ①超链接

​ < a href=“用路径的方法找目标地址”>超链接 < /a>
开发初期href(跳转地址)没有明确地址时写#,在超链接中可以嵌套img标签.

​ ②新窗口

​ 超链接属性_self 和 _blank

​ < a href=" 目标地址" target=“可选择新窗口的跳转方式”>超链接 < /a>

三.拓展(显示模式)

在初学时,可以在CSDN博客,菜鸟教程,w3cschool,MDN等网站学习基础标签的用法和特点.只需要掌握常见的标签和属性.不可能全部标签学完,在项目中遇到可以再详细了解.

标签分为块,行内块,行内元素.搞清楚哪些标签是哪种显示模式,是排版写网页的重要基础.后续文章将展开详细讲解.