HTML进阶知识点--HTML5属性变化

input标签type属性新增属性值

属性值 作用
tel 手机端不同
email 手机端键盘出现@
number 出现按钮,可以加减
url 手机端键盘出现.com
Date 选取日、月、年
Month 选取月、年
Week 选取周和年 <font color="red">不实用</font>
Time 选取时间(小时和分钟)
Datatime 选取时间、日、月、年(UTC时间) <font color="red">不实用</font>
Datatime-local 选取时间、日、月、年(本地时间)
range 一个可拉伸的进度条(pc端)
search 搜索框(pc端)
color 颜色选择框(pc端)

表单新增属性

autocomplete属性

form 或 input 域应该拥有自动完成功能

<form autocomplete="on"></form>

注意:autocomplete 适用于 <form> 标签,以及以下类型的 <input> 标签:text、search、url、telephone、email、password、datepickers、range、color

autofocus属性

  • 规定在页面加载时,域自动地获取焦点

  • autofocus 属性适用于所有 <input> 标签的类型

语法:

<input autofocus="autofocus>

multiple属性

规定输入域中可选择多个值

PS:multiple 属性适用于以下类型的 <input> 标签:email 和 file

<input type="file" multiple="multiple">

placeholder属性

提供一种提示(hint),描述输入框所期待的值

PS:适用于 <input> 标签 type 属性值为:text、search、url、tel、email、password

required属性

规定必须在提交之前填写输入域(不能为空)

<input type="text" required="required">

减少前端开发人员写表单验证的压力

PS:适用于 <input> 标签 type 属性值为:text、search、url、tel、email、password、datepickers、number、checkbox、radio、file

链接新增属性

  1. <link> 的sizes

  2. <base> 的target

    • base 标签如果设置了 target 属性,就可以控制整个页面所有超链接的跳转方式
  3. <a> 标签

    • media = ""(表示对设备进行优化,handheld 对“手持”设备进行支持,tv 对“电视”设备进行支持

    • hreflang = "zh"(设置语言,这里设置语言是中文)

    • rel = "external"(设置超链接的引用,这里超链接为外部链接)

其他属性

script

  • defer:规定当页面已完成加载后,才会执行脚本

  • async:规定一旦脚本可用,将会异步执行

ol

属性 作用
start 起始值
reversed 倒序排列

html

manifest = "cache.manifest"(定义页面离线应用文件)(引号中内容cache可更改)

<html manifest="cache.manifest">

style

scoped:内嵌CSS

可以写在html文件的任意位置

<style scoped>
    ...
</style>
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

友情链接更多精彩内容