HTML5新增了哪些标签和属性?新增了标签和属性(总结)
本章给大家介绍HTML5新增了哪些标签和属性?新增了标签和属性(总结),让大家了解HTML5中新添加了哪些属性与标签。有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。
总结了一下HTML5的新特性,基本除了IE9以下都可以使用。
HTML5语法
大部分延续了html的语法
不同之处:开头的
<!DOCTYPE html> <html> <meta charset="utf-8">
字符编码变得简洁,不区分大小写,添加了布尔值,类似checked,selected
引号可以省略,但是编码规范来说,不建议使用
有可以省略结束符的标签,和完全省略的标签应用。
HTML5新增加的标签:
1、结构标签
(1)section:独立内容区块,可以用h1~h6组成大纲,表示文档结构,也可以有章节、页眉、页脚或页眉的其他部分;
(2)article:特殊独立区块,表示这篇页眉中的核心内容;
(3)aside:标签内容之外与标签内容相关的辅助信息;
(4)header:某个区块的头部信息/标题;
(5)hgroup:头部信息/标题的补充内容;
(6)footer:底部信息;
(7)nav:导航条部分信息;
(8)figure:独立的单元,例如某个有图片与内容的新闻块。
2、表单标签
(1)email:必须输入邮件;
(2)url:必须输入url地址;
(3)number:必须输入数值;
(4)range:必须输入一定范围内的数值;
(5)Date Pickers:日期选择器;
date:选取日、月、年
month:选取月、年
week:选取周和年
time:选取时间(小时和分钟)
datetime:选取时间、日、月、年(UTC时间)
datetime-local:选取时间、日、月、年(本地时间)
(6)search:搜索常规的文本域;
(7)color:颜色。
3、媒体标签
(1)video:视频;
(2)audio:音频;
(3)embed:嵌入内容(包括各种媒体),Midi、Wav、AU、MP3、Flash、AIFF等。
4、其他功能标签
(1)mark:标注,高亮显示(像荧光笔做笔记);
(2)progress:进度条;
(3)time:数据标签,给搜索引擎使用;发布日期更新日期;
(4)ruby和rt:对某一个字进行注释;;
(5)wbr:软换行,页面宽度到需要换行时换行;
(6)canvas:使用JS代码做内容进行图像绘制;
(7)command:按钮;
(8)deteils :展开菜单;
(9)dateilst:文本域下拉提示;
(10)keygen:加密。
新增的属性:
对于js进行添加的属性。
<script defer src=".....js" onload="alert('a')"></script> <script async src=".....js" onload="alert('b')"></script>
如果没有以上两个属性的话,执行顺序为先加载(下载)第一个src,然后在执行其onload,然后在向下依次同步执行defer属性在h5之前就已经有了,输入延迟加载(推迟执行),它会先加载(下载)src中文件内容,然后等页面全部加载完成后,再加载onload中js.async属性属于异步加载,它会在加载src后,立即执行onload,同时还会继续加载页面以上执行顺序,alert显示会先显示b然后再显示a。
网页中标签中加入小图标的样式代码
<link rel="icon" href="url..." type="图片名称" sizes="16*16">
有序列表ol:新增start(列表起始值),reversed(是否倒置)menu菜单type属性(3个菜单类型)内嵌css样式:在标签内部来定义一个样式区块(scoped),只对样式标签内部才有效内嵌框架:iframe元素,新增了seamless无边距无边框,srcdoc定义了内嵌框架的内容。
manifest属性:
定义页面需要用到的离线应用文件,一般放在标签里
charset属性:
meta属性之一,定义页面的字符集
sizes属性:
新增属性,当link的rel="icon"时,用以设置图标大小
base属性:
defer属性:
script标签属性,表示脚本加载完毕后,只有当页面也加载完毕才执行(推迟执行)
async属性:
script标签属性,脚本加载完毕后马上执行(运行过程中浏览器会解析下面的内容),即使页面还没有加载完毕(异步执行)
media属性:
hreflang属性:
ref属性:
reversed属性:
- 的属性,定义序号是否倒叙
start属性:
- 的属性,定义序号的起始值
scoped属性:
内嵌CSS样式的属性,定义该样式只局限于拥有该内嵌样式的元素,适用于单页开发
HTML5全局属性:对任意标签都可以使用的,以下6个
data-yourvalue 、hidden、Spenllecheck、tabindex、contenteditable、desginMode;
全局属性:
1.可直接在标签里插入的:data-自定义属性名字。
hidden(直接放上去就是隐藏);
spellcheck="true"(语法纠错);
tabindex="1"(Tab跳转顺序);
contenteditable="true"(可编辑状态,单击内容,可修改);
2.在JavaScript里插入的window.document.designMode = 'on'(JavaScript的全局属性,整个页面的文本都可以编辑了)。
Atas ialah kandungan terperinci HTML5新增了哪些标签和属性?新增了标签和属性(总结). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Alat AI Hot

Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool
Gambar buka pakaian secara percuma

Clothoff.io
Penyingkiran pakaian AI

Video Face Swap
Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Artikel Panas

Alat panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas





Panduan untuk Sempadan Jadual dalam HTML. Di sini kita membincangkan pelbagai cara untuk menentukan sempadan jadual dengan contoh Sempadan Jadual dalam HTML.

Ini ialah panduan untuk Nested Table dalam HTML. Di sini kita membincangkan cara membuat jadual dalam jadual bersama-sama dengan contoh masing-masing.

Panduan untuk HTML margin-kiri. Di sini kita membincangkan gambaran keseluruhan ringkas tentang HTML margin-left dan Contoh-contohnya bersama-sama dengan Pelaksanaan Kodnya.

Panduan untuk Susun Atur Jadual HTML. Di sini kita membincangkan Nilai Susun Atur Jadual HTML bersama-sama dengan contoh dan output n perincian.

Panduan untuk Pemegang Tempat Input HTML. Di sini kita membincangkan Contoh Pemegang Tempat Input HTML bersama-sama dengan kod dan output.

Panduan untuk Memindahkan Teks dalam HTML. Di sini kita membincangkan pengenalan, cara teg marquee berfungsi dengan sintaks dan contoh untuk dilaksanakan.

Panduan kepada Senarai Tertib HTML. Di sini kami juga membincangkan pengenalan senarai dan jenis Tertib HTML bersama-sama dengan contoh mereka masing-masing

Panduan untuk Butang onclick HTML. Di sini kita membincangkan pengenalan, kerja, contoh dan onclick Event masing-masing dalam pelbagai acara.
