本文主要介绍HTML的基础知识。HTML是指超文本标记语言，超文本标记语言不是一种编程语言，而是一种标记语言。需要具体了解HTML的，可以参考这篇文章。

目录

标签分类常用标签表单框架常见布局组合标签HTML4和HTML5的区别：HTML5中新增语义标签-了解HTML5新增表单属性 表单新增属性输入新属性HTML5新增表单元素-了解 HTML5中新增输入类 HTML5中新增音频 HTML5中新增视频标签的属性：html 5中移除元素转义符

标签属性名称1='属性值'属性名称2='属性值'/标签名称

p id='p1' name='p1 '

/p

标签分类

标签分类：块状元素、行级元素

块状元素:一般是新行，可以容纳行中的元素和其他块级元素；

行级元素:一般是语义层面的基本元素，只能容纳文本或其他行内元素。

块状元素和行内元素的区别：

1.块级元素会独占一行，其宽度会自动填充其父元素的宽度；一行中的元素排列在同一行中，它们的宽度随元素的内容而变化。

2.块级元素可以设置宽度和高度；内嵌元素的宽度和高度设置无效。

3.可以为块级元素设置边距和填充属性；行中元素水平方向的填充有边距效果，但垂直方向的填充没有效果。(这里的属性后面会介绍)

属于块状元素的：

标题h1-h6，

第p段，

水平线hr，

有序列表标签ol - li，

标签为ul - li无序列表，

定义了标记为dl-dt-dd描述，

标签分区：

属于行级元素的：

范围：span

图片：img

基本结构：

常用标签

文本标签h1/h1

段落标签 p/p

换行标签br/

水平线标签 hr/

范围标签span/span

图片标签img 属性 /

图片标签的热点区域map name="?"/ atea形状范围链接标题 /

列表标签:无序ul li li/ ul/ 有序ol li li/ ol/

描述标签 ：图文混编 dl dt(文字或图片)dt/dd(文字说明多个)dd/ dl/

布局标签:div中间放其他标签的容器div/

超链接和锚链接：aa/

属性：anchor herf: target(网页# anchor)

规则表格：table tr tdtd/ tdtd/ tr/ table/标题行th/

左右对齐上下对齐

不规则表格：

属性colspan='列数' rowspan='行数'，然后删除已占用的网格。

高级标签:标题和逻辑分区标签

标题：标题标题文本标题/

表的逻辑分区：theadtbodytfoot

表单

ID:元素的唯一表示，不重复。

Name:服务器通过其获取数据的表单项目元素的名称。

Value:表单项元素的值，服务器通过name获取数据，也就是值。

类型：表示表单项元素的呈现形式。

类别：指示样式名称。

Readonly:表示只读，用户只能读不能改。

禁用：表示禁用，此元素不可更改，背景为灰色。

文本框：

密码框：

单选按钮：

复选框：

文件域：

日期-h5中的新特性 :

隐藏域：

下拉列表框：

文本域：

按钮：

提交按钮，图片按钮，重置按钮，正常按钮

最终效果：

地址栏内容：

dest.html？

userId=1001

用户名=lina

密码=12312

性别=女性

状态=1

爱好=游泳爱好=电影

headImg=a.png

生日=2020-10-24T20:19

月=3x=25y=46

框架

在一个页面中引入其他页面的iframe

框架集：HTML5已经取消

常用的布局组合标签

通常用于导航布局。

Div-dl-dt-dd:常用于图文混合布局。

Div-form:通常用于表单布局

Div-table:它通常用于本地规则数据显示布局。

HTML4和HTML5的区别：

HTML5 中新增的语义标签 - 了解

标签描述

文章定义了页面的独立内容区域。

side定义了页面的侧边栏内容。

Bdi允许您将一段文本设置为偏离其父元素的文本方向设置。

细节用于描述文档或文档的一部分的细节。

对话框定义对话框，如提示框。

summary标记包含details元素的标题。

页眉定义文档的页眉区域。

页脚定义节或文档的页脚。

导航定义了导航链接的一部分。

进度定义任何类型任务的进度。

Section定义文档中的一个节(section，section)。

定义日期或时间。

Wbr指定在文本中添加换行符的合适位置。

HTML5 新的表单属性

form 新属性

Autocomplete属性指定表单或输入域应具有自动完成功能。

当用户开始在自动完成字段中输入内容时，浏览器应该在该字段中显示已填充的选项。

提示:autocomplete属性可以在form元素中打开，在input元素中关闭。

注意:自动完成功能适用于输入标签，以及以下类型的输入标签:文本、搜索、URL、电话、电子邮件、密码、日期选择器、范围和颜色。

表单操作=' '自动完成='on '

name:input type=' text ' name=' name ' br

电话：input type='text' name='phone' br

电子邮件：input type=' email ' name=' email ' autocomplete=' off ' br

输入类型='提交'

/表单

测试的时候需要先输入，然后刷新页面再输入一次才能看到效果。

有些浏览器可能不会自动支持，所以您需要自己启用它。

input 新属性

list属性指定输入字段的数据列表。Datalist是输入域的选项列表。

输入列表='公司'

数据列表id='公司'

期权价值='阿里巴巴'

选项值='百度'

期权价值='腾讯'

选项值='zijie '

选项值='didi '

/数据列表

多重属性是布尔属性。

multiple属性指定可以在input元素中选择多个值。

注意:多重属性适用于以下类型的输入标记：email和fifile。

上传多个文件：输入类型=' file' name=' img' multiple

placeholder属性提供了描述输入字段预期值的提示。

在用户输入值之前，输入字段上会显示一个简短的提示。

注意:占位符属性适用于以下类型的输入标记：文本、搜索、URL、电话、电子邮件和密码。

type=' text ' name=' username ' placeholder='请输入用户名'

必需的属性是布尔属性。

required属性指定在提交之前必须填写输入字段(不能为空)。

注意:必需属性适用于以下类型的输入标记：文本、搜索、URL、电话、电子邮件、密码、日期选择器、数字、复选框、单选和归档。

用户名：需要输入type=' text' name=' username '

HTML5 新的表单元素 -- 了解

标签描述

Datalist输入标记定义了一个选项列表。与input元素一起使用，定义输入的可能值。

Keygen指定表单的密钥对生成器字段。

output标签定义了不同类型的输出，比如脚本的输出。

HTML5 中新的 input 类型

HTML5有几种新的表单输入类型。这些新功能提供了更好的输入控制和验证。

颜色

日期

日期时间

日期时间-本地

电子邮件

月

数字

范围

搜索

电话

时间

全球资源定位器(Uniform Resource Locator)

周

注意:不是所有的主流浏览器都支持新的输入类型，但是你已经可以在所有的主流浏览器中使用了。即使不支持，它仍然可以显示为常规文本字段。

HTML5 中新增的音频

直到现在，网页播放音频仍然没有标准。大部分音频是通过插件(比如Flash)播放的。然而，并不是所有的浏览器都有相同的插件。HTML5规定了在网页中嵌入音频元素的标准，即使用音频元素。

音频控制

source src=' horse . ogg ' type=' audio/ogg '

source src=' horse . MP3 ' type=' audio/mpeg '

您的浏览器不支持音频元素。

/音频

Ps: control属性用于添加播放、暂停和音量控件。

在audio和/audio之间，需要插入浏览器不支持的音频元素的提示文本。

音频元素允许多个源元素。源元素可以链接不同的音频文件，浏览器将使用第一个支持的音频文件。

目前，audio元素支持三种音频格式文件：MP3、Wav和Ogg:

音频格式的MIME类型

格式化MIME类型

MP3音频/mpeg

Ogg音频/ogg

Wavaudio/wav

HTML5 中新增的视频

视频宽度='320 '高度='240 '控件

source src=' movie . MP4 ' type=' video/MP4 '

source src=' movie . ogg ' type=' video/ogg '

您的浏览器不支持视频标签。

/视频

视频元素提供播放、暂停和音量控制来控制视频。

同时，video元素还提供了宽度和高度属性来控制视频大小。如果设置的高度和宽度，则所需的

页面加载时会保留视频空间。如果没有设置这些属性，浏览器就不知道视频的大小，浏览器就无法再次加载。

保留特定的空间，页面会根据原始视频的大小而变化。

在video和/video标签之间插入的内容是为不支持显示视频元素的浏览器提供的。

目前，video元素支持三种视频格式：MP4、WebM和Ogg:

格式化MIME类型

MP4视频/mp4

奥格音频/奥格

视频/网络视频

！文档类型html

超文本标记语言

头

meta charset='UTF-8 '

标题视频音频/标题

/头

身体

H1音频/h1

音频控制

source src=' audio/WGS . ogg ' type=' audio/ogg '

source src=' audio/zjl . MP3 ' type=' audio/mpeg '

您的浏览器不支持音频元素。

/音频

H1视频/h1

视频宽度='1320 '高度='640 '控件

source src=' audio/ruhai . MP4 ' type=' video/MP4 '

source src=' audio/WGS . ogg ' type=' video/ogg '

您的浏览器不支持视频标签。

/视频

/body

/html

HTML5 中已经移除的元素

设计

框式支架

无框架

转义符号

关于HTML基础知识总结的这篇文章就到这里了。要了解更多相关的HTML基础知识，请搜索我们以前的文章或继续浏览下面的相关文章。希望你以后能支持我们！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。