html5标签有哪些

轻墨同学_3779

轻墨同学_3779

2021-06-09

16195人浏览

原创

html5标签有:p、a、img、map、area、html、body、br、b、big、em、i、small、strong、sub、sup、ins、del、code、samp、kbd、tt、var、pre、address、bdo、q等。

本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。

最常用的 HTML5 标签及属性

基本的 HTML 标签

<h1> - <h6> 标签定义 HTML 标题
</h6>
</h1><p> 标签定义 HTML 段落
<a> 标签定义 HTML 链接
   超链接:
   >通过使用 href 属性 - 创建指向另一个文档的链接
   >通过使用 name 属性 - 创建文档内的书签
   >通过使用 Target 属性,你可以定义被链接的文档在何处显示
   >语法:</a><a>Link text</a>
   锚点:
   >语法:<a>锚(显示在页面上的文本)</a>
@@##@@ 标签定义 HTML 图像
<map>	定义图像地图
<area>	定义图像地图中的可点击区域
	定义 HTML 文档
	定义文档的主体
<hr> 标签创建 HTML 页面水平线
 <!-- --> HTML 注释
<br>	插入单个折行(换行)</map></p>

HTML 文本格式化标签

<b> 定义粗体文本
<big> 定义大号字
<em> 定义着重文字
<i> 定义斜体字
<small> 定义小号字
<strong> 定义加重语气
<sub>	定义下标字
<sup>	定义上标字
<ins>	定义插入字
<del>	定义删除字</del></ins></sup></sub></strong></small></i></em></big></b>

HTML “计算机输出”标签

<code> 定义计算机代码
<kbd> 定义键盘码
<samp> 定义计算机代码样本
<tt> 定义打字机代码
<var> 定义变量
<pre class="brush:php;toolbar:false;"> 定义预格式文本

HTML 引文、引用和定义标签

<abbr>	定义缩写或首字母缩略语
<address>	定义文档作者或拥有者的联系信息
<bdo>	定义文本方向
<blockquote>	定义从其他来源引用的节
<dfn>	定义项目或缩略词的定义
<q>	定义短的行内引用
<cite>	定义著作的标题</cite></q></dfn>
</blockquote></bdo>
</address></abbr>

HTML CSS样式

<style>	定义样式定义
<link>	定义资源引用
<p>	定义文档中的节或区域(块级)
<span>	定义文档中的行内的小块或区域
<font>	规定文本的字体、字体尺寸、字体颜色。不赞成使用。请使用样式
<center>	对文本进行水平居中。不赞成使用。请使用样式</style>

HTML 表格标签


 定义表格
	定义表格的行
	定义表格的页眉
	定义表格的主体
	定义表格的页脚
定义用于表格列的属性
定义表格列的组

HTML 列表

<ol>	定义有序列表
</ol>
    定义无序列表
  • 定义列表项
    定义定义列表
    定义定义项目
    定义定义的描述

    HTML 分组标签

    <p>	定义文档中的分区或节(pision/section)。
    <span>	定义 span,用来组合文档中的行内元素。</span></p>

    HTML Iframe 标签

    (1)添加 iframe 的语法: URL 指向隔离页面的位置。

    (2)height 和 width 属性用于规定 iframe 的高度和宽度。属性值的默认单位是像素,但也可以用百分比来设定(比如 “80%”)。

    实例:

    (3)删除边框

    frameborder 属性规定是否显示 iframe 周围的边框。设置属性值为 “0” 就可以移除边框。实例:

    (4)使用 iframe 作为链接的目标

    iframe 可用作链接的目标(target)。链接的 target 属性必须引用 iframe 的 name 属性。实例:

    HTML 头部元素

    	定义关于文档的信息
    <title>	定义文档标题
    <base>	定义页面上所有链接的默认地址或默认目标
    <link>	定义文档与外部资源之间的关系
    <meta>	定义关于 HTML 文档的元数据
    <script>	定义客户端脚本
    <style>	定义文档的样式信息</script>
    </title>

    HTML 中有用的字符实体

    注释:实体名称对大小写敏感

    HTML 表单

    <input> 元素有很多形态,根据不同的 type 属性。
    (1)text	定义常规文本输入。
    <input> 定义用于文本输入的单行输入字段。
    (2)radio	定义单选按钮输入(选择多个选择之一)。
    <input> 定义单选按钮。
    (3)submit	定义提交按钮(提交表单)。
    <input> 定义用于向表单处理程序(form-handler)提交表单的按钮。
    (4)action 属性定义在提交表单时执行的动作。向服务器提交表单的通常做法是使用提交按钮。通常,表单会被提交到 web 服务器上的网页。
    
     如果省略 action 属性,则 action 会被设置为当前页面。 (5)button属性定义按钮。  (6)method 属性规定在提交表单时所用的 HTTP 方法(GET 或 POST):
    或:
    (7)name规定识别表单的名称(对于 DOM 使用:document.forms.name)。 (8)用 
     组合表单数据:
     元素组合表单中的相关数据, 元素为 
     元素定义标题。 (9)novalidate 规定浏览器不验证表单。 (10)target规定 action 属性中地址的目标(默认:_self)。 (11)date用于应该包含日期的输入字段 。month允许用户选择月份和年份 。week允许用户选择周和年 。time允许用户选择时间(无时区) 。datetime允许用户选择日期和时间(有时区) 。datetime-local允许用户选择日期和时间(无时区) 。color用于应该包含颜色的输入字段 。range用于应该包含一定范围内的值的输入字段 。根据浏览器支持,日期选择器会出现输入字段中。 (12)search 用于搜索字段(搜索字段的表现类似常规文本字段)。tel用于应该包含电话号码的输入字段 。url 用于应该包含 URL 地址的输入字段。

    HTML Input 属性

    • value 属性:规定输入字段的初始值。

    • readonly 属性:规定输入字段为只读(不能修改),readonly 属性不需要值。它等同于 readonly=“readonly”。

    • disabled 属性:规定输入字段是禁用的,被禁用的元素是不可用和不可点击的,被禁用的元素不会被提交。disabled 属性不需要值。它等同于 disabled=“disabled”。

    • size 属性:规定输入字段的尺寸(以字符计)。

    • maxlength 属性:规定输入字段允许的最大长度。

    • autocomplete 属性:规定表单或输入字段是否应该自动完成。当自动完成开启,浏览器会基于用户之前的输入值自动填写值。

    • novalidate 属性属于属性。如果设置,则 novalidate 规定在提交表单时不对表单数据进行验证。

      响应式烟草公司HTML5网站模板
      响应式烟草公司HTML5网站模板

      响应式烟草公司HTML5网站模板是一款适合提供各种不同种类的优质烟草公司宣传网站模板下载。提示:本模板调用到谷歌字体库,可能会出现页面打开比较缓慢。

      下载
    • autofocus 属性是布尔属性。如果设置,则规定当页面加载时 元素应该自动获得焦点。

    • form 属性规定元素所属的一个或多个表单。如需引用一个以上的表单,请使用空格分隔的表单 id 列表。

    • ormaction 属性规定当提交表单时处理该输入控件的文件的 URL。formaction 属性覆盖元素的 action 属性。formaction 属性适用于 type=“submit” 以及 type=“image”。

    • formenctype 属性规定当把表单数据(form-data)提交至服务器时如何对其进行编码(仅针对 method=“post” 的表单)。formenctype 属性覆盖 元素的 enctype 属性。formenctype 属性适用于 type=“submit” 以及 type=“image”。

    • formmethod 属性定义用以向 action URL 发送表单数据(form-data)的 HTTP 方法。formmethod 属性覆盖 元素的 method 属性。formmethod 属性适用于 type=“submit” 以及 type=“image”。

    • novalidate 属性是布尔属性。如果设置,则规定在提交表单时不对元素进行验证。formnovalidate 属性覆盖 元素的 novalidate 属性。formnovalidate 属性可用于 type=“submit”。

    • formtarget 属性规定的名称或关键词指示提交表单后在何处显示接收到的响应。formtarget 属性会覆盖 元素的 target 属性。formtarget 属性可与 type=“submit” 和 type=“image” 使用。

    • height 和 width 属性规定 元素的高度和宽度。height 和 width 属性仅用于 。

    • list 属性引用的 元素中包含了 元素的预定义选项。

    • min 和 max 属性规定 元素的最小值和最大值。min 和 max 属性适用于如需输入类型:number、range、date、datetime、datetime-local、month、time 以及 week。

    • multiple 属性是布尔属性。如果设置,则规定允许用户在 元素中输入一个以上的值。multiple 属性适用于以下输入类型:email 和 file。

    • pattern 属性规定用于检查 元素值的正则表达式。pattern 属性适用于以下输入类型:text、search、url、tel、email、and password。

    • placeholder 属性规定用以描述输入字段预期值的提示(样本值或有关格式的简短描述)。该提示会在用户输入值之前显示在输入字段中。placeholder 属性适用于以下输入类型:text、search、url、tel、email 以及 password。

    • required 属性是布尔属性。如果设置,则规定在提交表单之前必须填写输入字段。required 属性适用于以下输入类型:text、search、url、tel、email、password、date pickers、number、checkbox、radio、and file。

    • step 属性规定 元素的合法数字间隔。示例:如果 step=“3”,则合法数字应该是 -3、0、3、6、等等。

    <article>	定义文档内的文章。
    <aside>	定义页面内容之外的内容。
    <bdi>	定义与其他文本不同的文本方向。
    <details>	定义用户可查看或隐藏的额外细节。
    <dialog>	定义对话框或窗口。
    <figcaption>	定义 <figure> 元素的标题。
    <figure>	定义自包含内容,比如图示、图表、照片、代码清单等等。
    <footer>	定义文档或节的页脚。
    <header>	定义文档或节的页眉。
    <main>	定义文档的主内容。
    <mark>	定义重要或强调的内容。
    <menuitem>	定义用户能够从弹出菜单调用的命令/菜单项目。
    <meter>	定义已知范围(尺度)内的标量测量。
    <nav>	定义文档内的导航链接。
    <progress>	定义任务进度。
    <rp>	定义在不支持 ruby 注释的浏览器中显示什么。
    <rt>	定义关于字符的解释/发音(用于东亚字体)。
    <ruby>	定义 ruby 注释(用于东亚字体)。
    <section>	定义文档中的节。
    <summary>	定义 <details> 元素的可见标题。
    <time>	定义日期/时间。
    <wbr>	定义可能的折行(line-break)。
    <canvas>	定义使用 JavaScript 的图像绘制。
    <svg>	定义使用 SVG 的图像绘制。
    <audio>	定义声音或音乐内容。
    @@@###@@@	定义外部应用程序的容器(比如插件)。
    <source>	定义 <video> 和 <audio> 的来源。
    <track>	定义 <video> 和 <audio> 的轨道。
    <video>	定义视频或影片内容。</video></audio></video></track></audio></video></source></audio></svg></canvas></wbr></time></details></summary></section></ruby></rt></rp></progress></nav></meter></menuitem></mark></main></header></footer></figure></figure></figcaption></dialog></details></bdi></aside></article>

    推荐学习:html视频教程

    在这里插入图片描述
定义表格标题
定义表格的表头
定义表格单元

前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!

相关文章

HTML速学教程(入门课程)
HTML速学教程(入门课程)

HTML怎么学习?HTML怎么入门?HTML在哪学?HTML怎么学才快?不用担心,这里为大家提供了HTML速学教程(入门课程),有需要的小伙伴保存下载就能学习啦!

下载

相关标签:

html5

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
html5动画制作有哪些制作方法
html5动画制作有哪些制作方法

html5动画制作方法有使用CSS3动画、使用JavaScript动画库、使用HTML5 Canvas等。想了解更多html5动画制作方法相关内容,可以阅读本专题下面的文章。

2023.10.23

4611

6

HTML与HTML5的区别
HTML与HTML5的区别

HTML与HTML5的区别:1、html5支持矢量图形,html本身不支持;2、html5中可临时存储数据,html不行;3、html5新增了许多控件;4、html本身不支持音频和视频,html5支持;5、html无法处理不准确的语法,html5能够处理等等。想了解更多HTML与HTML5的相关内容,可以阅读本专题下面的文章。

2024.03.06

8168

6

html5从入门到精通汇总
html5从入门到精通汇总

想系统掌握HTML5开发?本合集精选全网优质学习资源,涵盖免费教程、实战项目、视频课程与权威电子书,从基础语法到高级特性(Canvas、本地存储、响应式布局等)一应俱全,适合零基础小白到进阶开发者,助你高效入门并精通HTML5前端开发。

2025.12.30

854

19

html5新老标签汇总
html5新老标签汇总

HTML5在2026年持续优化网页语义化与交互体验,不仅引入了如<header>、<nav>、<article>、<section>、<aside>、<footer>等结构化标签,还新增了<video>、<audio>、<canvas>、<figure>、<time>、<mark>等增强多媒体与

2025.12.30

734

12

html5空格代码怎么写
html5空格代码怎么写

在HTML5中,空格不能直接通过键盘空格键实现,需使用特定代码。本合集详解常用空格写法:&nbsp;(不间断空格)、&ensp;(半个中文空格)、&emsp;(一个中文空格)及CSS的white-space属性等方法,帮助开发者精准控制页面排版,避免因空格失效导致布局错乱,适用于新手入门与实战参考。

2025.12.30

413

8

html5怎么做网站教程
html5怎么做网站教程

想从零开始学做网站?这份《HTML5怎么做网站教程》合集专为新手打造!涵盖HTML5基础语法、页面结构搭建、表单与多媒体嵌入、响应式布局及与CSS3/JavaScript协同开发等核心内容。无需编程基础,手把手教你用纯HTML5创建美观、兼容、移动端友好的现代网页。附实战案例+代码模板,快速上手,轻松迈出Web开发第一步!

2025.12.31

541

12

HTML5建模教程
HTML5建模教程

想快速掌握HTML5模板搭建?本合集汇集实用HTML5建模教程,从零基础入门到实战开发全覆盖!内容涵盖响应式布局、语义化标签、Canvas绘图、表单验证及移动端适配等核心技能,提供可直接复用的模板结构与代码示例。无需复杂配置,助你高效构建现代网页,轻松上手前端开发!

2025.12.31

378

7

html5怎么使用
html5怎么使用

想快速上手HTML5开发?本合集为你整理最实用的HTML5使用指南!涵盖HTML5基础语法、主流框架(如Bootstrap、Vue、React)集成方法,以及无需安装、直接在线编辑运行的平台推荐(如CodePen、JSFiddle)。无论你是新手还是进阶开发者,都能轻松掌握HTML5网页制作、响应式布局与交互功能开发,零配置开启高效前端编程之旅!

2025.12.31

641

20

html5怎么播放视频
html5怎么播放视频

想让网页流畅播放视频?本合集详解HTML5视频播放核心方法!涵盖<video>标签基础用法、多格式兼容(MP4/WebM/OGV)、自定义播放控件、响应式适配及常见浏览器兼容问题解决方案。无需插件,纯前端实现高清视频嵌入,助你快速打造现代化网页视频体验。

2025.12.31

558

20

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
HTML5/CSS3/JavaScript/ES6入门课程
HTML5/CSS3/JavaScript/ES6入门课程

共102课时 | 11万人学习

HTML+CSS基础与实战
HTML+CSS基础与实战

共132课时 | 19.5万人学习

前端开发(基础+实战项目合集)
前端开发(基础+实战项目合集)

共60课时 | 6.6万人学习