持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第14天，点击查看活动详情
HTML作为前端三大基础之一，应该没有前端工程师没用过吧。HTML的属性有很多，全部记住也不现实，主要是没必要。但是常见的一些属性还是要时刻记得的，本文就来总结一些可能不常见还是有点意思的HTML属性。
enterKeyHint
enterKeyHint是虚拟键盘上回车键呈现的操作标签，这是一个枚举属性，目前只能使用内置的一些值，如果传入其他值或者不是内置的值，将会识别为空字符串，键盘中的回车键将会是默认的文本：
enterdonegonextprevioussearchsend
enterKeyHint只能用于可编辑元素上，例如输入框以及contenteditable为true的元素。
<input type="text" enterkeyhint="next">
<div contenteditable></div>
运行效果：
- 如果是PC端，使用键盘的话将没有什么效果
- 如果是移动端，使用的是虚拟屏幕键盘，那么可以看到键盘的回车键的文本内容将变成我们设置的。
enterkeyhint兼容性
reversed
我们经常使用ol来表示有序的列表，特别是需要显示出编号的情况。ol的编号默认是由低到高，也就是顺序排序，如果我们要想实现编号由高到低排序，则可使用reversed属性
<ol reversed>
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
</ol>
实现效果：
如果不使用reversed属性，也可以通过列表的index来计算得到，但是显然这种方式比较麻烦。细心的朋友可能还发现了，虽然列表的编号倒序排序了，但是其内容本身并没有发生变化。
兼容性：
既然说到了ol的reversed属性，那就再来看看其他有意思的属性：
-
start：整数值编号，表示列表的起始值，注意只能为数字。虽然可以指定type为字母、罗马数字等，但是start只能是数字 -
type：设置编号的类型，默认是数字。可选值范围有：- 1：表示数字
- i：表示小写罗马数字
- I：表示大写罗马数字
- a：表示小写英文字母
- A：表示大写英文字母
举个例子：
<ol reversed start="10" type="1">
<li>第一项</li>
<li>第二项</li>
<li value="20">第三项</li>
<li>第四项</li>
</ol>
运行结果：
在这里，我们还额外使用到了value属性，可以用来在特定列表项上指定自定义编号。
disablepictureinpicture
什么是画中画？画中画简单点来说就是视频可以脱离页面播放。实现画中画可以操作video，也可以使用canvas，还可以是新增的requestPictureInPicture()方法，本次提到的disablepictureinpicture是HTML的一个新属性，主要用于video标签，可禁止画中画。
<video src="" disablepictureinpicture>
兼容性：
download
在实际开发中，遇到需要处理文件下载时，我们经常会采用a标签的方式。但是遇到文本、JSON等内容时，浏览器默认会直接显示而不是下载。如果我们想点击a链接的时候下载文件，那么可以指定download属性，表示下载文件的名称。
如果该名称不是有效的文件名，浏览器会对其进行调整。注意该属性对IE不兼容。
<a href="" download="file" >文件下载</a>
总结
本文简单总结了几个有意思的HTML属性，说不定以后在项目中还能用到。
原创不易，转载请注明出处。
