IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> 系统运维 -> HTML5的新特性 -> 正文阅读

[系统运维]HTML5的新特性

HTML5新特性

1.语义化标签

标签样式标签描述
<hrader></header>文档的头部区域
<footer></footer>文档的尾部区域
<nav></nav>文档的导航区域
<section></section>文档中的节(section、区段)
<article></article>页面独立的内容区域
<aside></aside>页面的侧边栏内容
<detailes></detailes>描述文档或文档某个部分的细节
<summary></summary>标签包含 details 元素的标题
<dialog></dialog>描述对话框,如提示框

2.新增表单元素

表单元素表单描述
<datalist>元素规定输入域的选项列表,使用 <input> 元素的 list 属性与 <datalist> 元素的 id 绑定
<keygen>提供一种验证用户的可靠方法,标签规定用于表单的密钥对生成器字段。
<output>用于不同类型的输出

并且HTML5 拥有多个新的表单 Input 输入类型。这些新特性提供了更好的输入控制和验证。如color,date,datetime,email,numbertel,time等。

HTML5 新增的表单属性

1.placehoder 属性,简短的提示在用户输入值前会显示在输入域上。即我们常见的输入框默认提示,在用户输入后消失。

2.required 属性,是一个 boolean 属性。要求填写的输入域不能为空

3.pattern 属性,描述了一个正则表达式用于验证<input> 元素的值。

4.min 和 max 属性,设置元素最小值与最大值。

5.step 属性,为输入域规定合法的数字间隔。

6.height 和 width 属性,用于 image 类型的 <input> 标签的图像高度和宽度。

7.autofocus 属性,是一个 boolean 属性。规定在页面加载时,域自动地获得焦点。

8.multiple 属性 ,是一个 boolean 属性。规定<input> 元素中可选择多个值。

3.控制视频和音频的元素

<audio>元素,内有属性controls,可以提供控制音频的控件如暂停,播放和音量控件,当然,还可以通过dom中的play()和pause()方法来控制暂停和播放。

在<audio> 与 </audio> 之间需要插入浏览器不支持的<audio>元素的提示文本 。<audio> 元素允许使用多个 <source> 元素. <source> 元素可以链接不同的音频文件,浏览器将使用第一个支持的音频文件。目前, <audio>元素仅支持三种音频格式文件: MP3, Wav, 和 Ogg

<video>元素是控制视频的元素,内的属性大体和<audio>的相同,但是多了width和height控制视频占空间的大小,video 元素支持多个source 元素. 元素可以链接不同的视频文件。浏览器将使用第一个可识别的格式( MP4, WebM, 和 Ogg)

4.Canvas(画布)

HTML5 标签用于绘制图像(通过脚本,通常是 JavaScript)。

5.SVG绘图

  SVG是指可伸缩的矢量图形

SVG 与 Canvas两者间的区别:

  1.SVG 是一种使用 XML 描述 2D 图形的语言。

  2.Canvas 通过 JavaScript 来绘制 2D 图形。

  3.SVG 基于 XML,这意味着 SVG DOM 中的每个元素都是可用的。您可以为某个元素附加 JavaScript 事件处理器。

  4.在 SVG 中,每个被绘制的图形均被视为对象。如果 SVG 对象的属性发生变化,那么浏览器能够自动重现图形。

  5.Canvas 是逐像素进行渲染的。在 canvas 中,一旦图形被绘制完成,它就不会继续得到浏览器的关注。如果其位置发生变化,那么整个场景也需要重新绘制,包括任何或许已被图形覆盖的对象。

6.地理定位

7.拖放API

8.Web Worker

9.Web Storage

10.WebSocket

  系统运维 最新文章
配置小型公司网络WLAN基本业务(AC通过三层
如何在交付运维过程中建立风险底线意识,提
快速传输大文件,怎么通过网络传大文件给对
从游戏服务端角度分析移动同步(状态同步)
MySQL使用MyCat实现分库分表
如何用DWDM射频光纤技术实现200公里外的站点
国内顺畅下载k8s.gcr.io的镜像
自动化测试appium
ctfshow ssrf
Linux操作系统学习之实用指令(Centos7/8均
上一篇文章      下一篇文章      查看所有文章
加:2021-10-11 17:55:43  更:2021-10-11 17:57:23 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/15 17:25:18-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码