美文网首页
HTML进阶知识点--HTML5属性变化

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

作者: 梦幽辰 | 来源:发表于2019-12-22 15:11 被阅读0次

    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>
    

    相关文章

      网友评论

          本文标题:HTML进阶知识点--HTML5属性变化

          本文链接:https://www.haomeiwen.com/subject/qlpinctx.html