html5新特性有哪些，h5和c3新增特征( 二 )

2022-06-20 小知识

<link rev="parent" href="http://www.ncwxdh.com/p/category.html">

你可以再次将rev属性添加到你的链接。它之前在HTML 4中被定义，但HTML5不支持。 HTML 5.1允许开发人员再次为<link>和<a>元素使用此属性。 rev属性与rel相反，它指定当前文档和链接文档在相反方向上的关系（当前文档与链接文档的关系）。
rev属性已包含在HTML 5.1规范中，主要用于支持RDFa ，后者是一种广泛使用的结构化数据标记格式，并扩展了HTML语言。
7.使用零宽度图像
<img src="http://www.ncwxdh.com/p/yourimage.jpg" width="0" height="0" >

HTML 5.1允许开发人员创建width属性值为0的零宽度图像。如果你想要包含不想向用户显示的图像（例如跟踪图像文件）则此功能很有用。建议将零宽度图像与空alt属性一起使用。
8.分离浏览器上下文以防止网络钓鱼攻击
<a href="http://www.ncwxdh.com/p/#" target="_blank" rel="noopener">
Your link that won't make troubles
</a>

在你的网站上使用相同的源链接最终可能会让你陷入麻烦。该漏洞被称为target =“_ blank”漏洞，这是一个让讨厌的网络钓鱼攻击。你可以（安全地）测试下这个漏洞是如何在这个机智的Github演示页上进行攻击的，你可以在Github上查看该代码。
HTML 5.1已经标准化了rel =“noopener”属性的用法，它消除了分隔浏览器上下文的问题，你可以在<a>和<area>元素中使用rel =“noopener” 。
9.创建一个空选项
HTML 5.1允许开发人员创建一个空的<option>元素。 <option>标签可以是<select> ， <optgroup>或<datalist>元素的子元素。如果你不想建议用户应该选择哪个选项，以及在想要设计用户友好的表单时，使用空的<option>可能很有用。
10.更灵活地处理图形标题
<figcaption>标签表示<figure>元素的题注或说明，其是用于视觉（例如插图，照片和图表）的容器。以前， <figcaption>标记只能用作<figure>元素的第一个或最后一个子元素。 HTML 5.1已放松此规则，现在<figcaption>可以出现在其<figure>容器中的任何位置。
html5的新特性有哪些 1. 新的Doctype
尽管使用<!DOCTYPE html> ，即使浏览器不懂这句话也会按照标准模式去渲染
2. Figure元素
用<figure>和<figcaption>来语义化地表示带标题的图片
<figure>
<img src=http://www.ncwxdh.com/p/”path/to/image” alt=”About image” />
<figcaption>
<p>This is an image of something interesting. </p>
</figcaption>
</figure>
3. 重新定义的<small>
<small>已经被重新定义了，现在被用来表示小的排版，如网站底部的版权声明
4. 去掉link和script标签里面的type属性
5. 加/不加括号
HTML5没有严格的要求属性必须加引号，闭合不闭合，但是建议加上引号和闭合标签
6. 让你的内容可编辑，只需要加一个contenteditable属性
7. Email Inputs
如果我们给Input的type设置为email ，浏览器就会验证这个输入是否是email类型，当然不能只依赖前端的校验，后端也得有相应的校验
8. Placeholders
这个input属性的意义就是不必通过javascript来做placeholder的效果了
9. Local Storage
使用Local Storage可以永久存储大的数据片段在客户端（除非主动删除），目前大部分浏览器已经支持，在使用之前可以检测一下window.localStorage是否存在
10. 语义化的header和footer
11. 更多的HTML5表单特性
12. IE和HTML5
默认的， HTML5新元素被以inline的方式渲染，不过可以通过下面这种方式让
其以block方式渲染
header, footer, article, section, nav, menu, hgroup {

推荐阅读

上一篇：【紫荆花】紫金花和紫荆花一样吗

下一篇：【品种】目前最甜的梨新品种