02 HTML标签和语法

1.HTML标签

所谓的标签就是HTML语言的发明者人为定义好的一些“单词”，相当于学英语时候的单词一样

（1）设计者人为的将HTML标签划分为单标签和双标签

双标签  <标签名称>       （在英文输入法下输入）

单标签  <标签名称/>

（2）常见的标签

• 标题标签：在HTML中人为的定义了6个标题标签，分别是h1~h6，他们都是双标签，在一个网页中，只允许出现一个h1

假如有两个h1标签的话，对网页优化有影响https://zhidao.baidu.com/question/544280781.html

但是还是可以显示出来，所以为了后期维护，最好每页只写一个h1，或者不写也可以

• 段落标签  ：双标签   

• 换行标签：单标签 
  

所以手动换行是没有作用的，有专用的换行标签 

• 空格： ；

HTML中空格与 的区别

注意：在HTML中允许多个标签嵌套使用但是不允许交叉嵌套

在Hbuilder中插入注释  Ctrl+？

• 图片标签：单标签

img  单标签

这个标签的作用就是在网页中显示图片，图片与HTML都是独立的文件，我们想要在网页中显示图片，此时就需要借助img标签将网页外部的图片想办法拿到网页上进行展示

在这个语法当中我们可以发现与p标签相比较，img标签的身上多了一些东西，这些东西，我们称之为标签属性

src  它里面写的就是一个地址，这个地址就是图片所在地

img是标签名   src是标签属性

注意：

标签属性与标签名之间用空格隔开

标签属性由名字和值两部分组成，属性名和属性值之间用单引号进行连接

属性值需要放在引号里面，单引号或者双引号都无所谓（如果属性值是数字，那么可以省略引号）

注意：

1. img是一个单标签，它的作用是在网页当中插入图片
2. src是img标签的属性，它里面的值称之为属性值，具体表示想要加载的图片保存在哪里
3. 标签的身上可以有属性，属性名与标签名之间用空格隔开
4. 属性值与属性名之间用“ = ”进行连接
5. 一个标签身上可以有多个属性，之间都用空格隔开

图片的常见属性

1. src设置图片所在位置
2. alt 当图片加载失败的时候会显示它里面的文字
3. width  height 分别用来设置图片的宽和高，如果只设置了宽度和高度，那么另外一边会自动缩放
4. title 当鼠标悬停在图片上的时候会显示它里面的文字

• 链接标签

内容   可以实现在当前页面向新页面进行跳转的操作

属性

1. target这个属性可以设置新页面在哪个窗口打开，当值为_black的时候可以在新窗口打开
2. href的属性值设置为#的时候，可以设置为空连接，它的作用就是当用户点击链接的时候不会发生跳转