三、HTML语法规范

·  阅读 180
三、HTML语法规范

三、HTML语法规范

一)html标签的注释

注释内容(阅览中不会显示)

显示:<!-- --> 快捷键:ctrl +? 描述代码的功能,浏览器解析的时候会忽略掉不做显示 常见用处:理清逻辑,索览,理清结构。

二)html标签的构成

1.基本结构图:

一般由三部分组成,

例子:

<h3> ****** ****** ***</h3>

起始标记、元素内容,结束标记

快速输入方法:输入起始标记后按回车键

结构说明:

1)标签有<、>、/、英文单次或字母组成。

2)标签中被<>包括起来的英文单次或字母被称为标签名

3)常见的标签由两部分组成,称为双标签,即内容前后由开始标签和结束标签包裹起来

4)少数标签只有一个组成部分,称为单标签,如<hr>等,其自成一体、无法包裹内容

三)html标签的属性

1.完整结构图:

   起始标记          内容           结束标记
   <strong class="******">&&&&&&&</strong>
    标记名   属性名   属性值          标记名
                标签的属性(元素的额外信息附加信息)
复制代码

2.属性注意事项:

1)标签的属性写在开始标签内部;

2)标签上可以同时存在多个属性;

3)属性之间以空格隔开;

4)标签名(标记名)与属性之间必须以空格隔开;

5)属性之间没有顺序之分。

3.标签(元素)的层次结构关系

前提:元素的嵌套 三种:父子关系、兄弟关系、祖先后代关系

                             html
           head                                        body
 meta             title                            h3    a    img  
复制代码

1)父子关系(嵌套关系):a元素直接包含b元素

<head> <title></title> </head>

其中《head》为父元素,《title》为子元素

2)兄弟关系(并列关系):两个元素有同一个父级元素

<head> <title></title> <div></div> </head>

其中《title》和《div》就是兄弟关系,他们拥有同一个父元素

3.祖先后代关系:直接或间接包含

<head> <title></title> <div> <h1> </h1> </div> </head>

其中《head》就是《h1》的祖先元素,相反《h3》是《head》的后代元素

四)html5的变化

一)标签:

  1. 增加了doctype、meta;
  2. 新增了语义化标签和属性;
  3. 去掉了纯展示性的标签;
  4. 添加canvas、video、audio、本地储存、拖拽。

二)语法:

  1. 标记不区分大小写,不过推荐用小写;
  2. 空标记可以不闭合;
  3. 属性值可以不添加引号,建议添加;
  4. 属性值中包含ture和false的可以省略(用于控制属性是否生效)。
分类:
前端
标签:
分类:
前端
标签:
收藏成功!
已添加到「」, 点击更改