表单--Six

表单

<form action="">

        <!-- 地址类型:必须是http://或者:https://开头的 -->

        <input type="url" name="myurl">

        <!-- 邮箱类型:必须要@,只验证格式,不验证真假 -->

        <input type="email" name="myemail">

        <!-- 自带一个删除按钮 -->

        <input type="search" name="search">

        <!-- 数字类型 step:n; 只能输入n的倍数 -->

        <input type="number" name="number" step="3">

        <!-- 滑动条 -->

        <input type="range" name="range" max="100" value="50" min="0">

        <!-- 颜色 -->

        <input type="color">

        <!-- 日期 -->

        <hr>

        <input type="date" name="date">

        <input type="datetime-local" name="datetime">

        <input type="month" name="month">

        <input type="time" name="time">

        <input type="week" name="week">

        <hr>

        <hr>

        <input type="submit">

        <hr>

    </form>

    <!-- input的list属性绑定datalist的id -->

    <input type="text" list="cars">

    <datalist id="cars">

        <option value="奔驰"></option>

        <option value="奔奔"></option>

        <option value="奔腾"></option>

        <option value="宝马"></option>

        <option value="保时捷"></option>

        <option value="宝骏"></option>

    </datalist>

 <!-- form 标签是包含是所有表单标签的东西 -->

    <!-- url?name1=value1&name2=value2…… -->

    <form action="">

        <!-- 文本输入类型 -->

        <input type="text" placeholder="请输入用户名……" name="username">

        <input type="password" placeholder="请输入11位密码……" name="password" maxlength="11">

        <hr>

        <!-- 单选框,同样一组单选框,name必须相同 -->

        男<input type="radio" name="sex" value="male">

        女<input type="radio" name="sex" value="female">

        <hr>

        <!-- label标签。for属性对应相应input框的id -->

        <label for="a">男</label>

        <input type="radio" name="sex" value="male" id="a">

        <label for="b">女</label>

        <input type="radio" name="sex" value="female" id="b">

        <hr>

        <!-- 复选框 -->

        敲代码<input type="checkbox" name="hobby" value="coding" >

        玩游戏<input type="checkbox" name="hobby" value="play_game" >

        睡觉<input type="checkbox" name="hobby" value="sleeping" >

        <hr>

        <!-- 文件上传 -->

        <input type="file" name="file">

        <hr>

        <!-- 图像形式提交按钮 -->

        <input type="image" src="" width="">

        <hr>

        <!-- 隐藏域 可以提交,但是页面不显示 -->

        <input type="hidden" value="你好" name="hidden">

        <hr>

        <!-- 文本域 style="resize: none;"可以防止放大缩小 -->

        <textarea name="text" id="" cols="30" rows="10" style="resize: none;"></textarea>

        <hr>

        <!-- 提交按钮 -->

        <input type="submit" value="点击">

 

表单属性

<!-- 

        action 什么都不写是提交到当前页面,也可以被提交的其他服务器

        method 默认是GET,也可以设置POST

            GET一般是获取数据,POST提交数据

            POST相对更加安全,POST的数据一般比较大,GET更小一点

        checked 默认选中,应用到单选或复选框

        selected 默认选中,应用到下拉框

        value 表单的默认值,用于提交后台

        readonly 只读,不能修改,能提交

        disable 禁用,不能修改,也不能提交,也可以用于禁用按钮

        placeholder 输入框提示

        maxlength 限制输入框最大长度

        size 用于下拉框,设置默认显示几条选项,但是也只能选择一个

     -->

    <form action="https://www.baiducom/s" method="GET">

        <input type="text" name="wd">

        <label for="a">男</label>

        <input type="radio" name="sex" value="male" id="a" checked>

        <label for="b">女</label>

        <input type="radio" name="sex" value="female" id="b">

    </form>

 

<!-- 

        autofocus 默认获取鼠标焦点

        form属性可以把外部的表单标签加到相应的form标签

        requird 设置为必填项

        pattern 后面写正则表达式校验

        multiple 设置可以多选,一般应用到file格式

     -->

    <form action="" id="form1">

    </form>

    <input type="submit" form="form1">

上一篇:8.7考试总结(NOIP模拟)[Smooth·Six·Walker]


下一篇:The six Day 数组中找出和为目标值