zoukankan      html  css  js  c++  java
  • HTML5-新增表单元素

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
    <form action="">
        <form action="">
            用户名:<input type="text" name="userName"><br>
            密码:<input type="password" name="userPwd"> <br>
            加密:<keygen></keygen><br>
            <input type="submit">
        </form>
    
        <!--显示输出信息:只能显示不能修改
        1.语义性更强
        2.值需要你去设置,不能自动计算-->
        <output>总金额:¥100.00</output>
        
        
        <!--专业:
        <select name="" id="">
            <option value="1">前端与移动开发</option>
            <option value="2">java</option>
            <option value="3">javascript</option>
            <option value="4">c++</option>
        </select>-->
        <!--不仅可以选择,还应该可以输入-->
        <!--建立输入框与datalist的关联  list="datalist的id号"-->
        专业:<input type="text" list="subjects"> <br>
        <!--通过datalist创建选择列表-->
        <datalist id="subjects">
            <!--创建选项值:value:具体的值 label:提示信息,辅助值-->
            <!--option可以是单标签也可以是双标签-->
            <option value="英语" label="不会"/>
            <option value="前端与移动开发" label="前景非常好"></option>
            <option value="java" label="使用人数多"></option>
            <option value="javascript" label="做特效"></option>
            <option value="c" label="不知道"></option>
        </datalist>
    
        网址:<input type="url" list="urls">
        <datalist id="urls">
            <!--如果input输入框的type类型是url,那么value值必须添加http://-->
            <option value="http://www.baidu.com" label="百度"></option>
            <option value="http://www.sohu.com"></option>
            <option value="http://www.163.com"></option>
        </datalist>
    </form>
    </body>
    </html>
    

      

  • 相关阅读:
    由 container 一词所想到的
    突然间,firebug中不显示用console.log打印的信息了
    学习计划表-快照-2017.2.16
    学习编程让我成功减肥!
    什么是编程?
    计算两个事件之间的时间差
    使用substring和split方法从字符串中抽取一组清单
    js中十进制数转换为16进制
    Definition of success-成功的定义
    如何让老式浏览器支持html5新增的语义元素
  • 原文地址:https://www.cnblogs.com/eadela/p/11322356.html
Copyright © 2011-2022 走看看