From表单的属性与Input元素

作者: BrightenSun | 来源:发表于2017-01-10 20:56 被阅读0次

From表单的属性与Input元素
h5表单
智能表单
HTML5属性
HTML 表单元素
form表单
h5学习笔记-form
HTML中表单的创建和处理的一些基本知识
表单中的name和id
通过css来验证表单输入框input是否验证通过

From表单的属性与Input中的类型与属性;

    <style>
        *{
            margin:0;padding:0;
        }
        li{
            margin:10px;list-style: none;
        }
    </style>
    <body>
        <form action="" method="get">
            <ul>
                <li><input type="text" name=""/></li>
                <li><input type="password" name=""/></li>
                <li><input type="email" name=""/></li>
                <li><input type="url" name=""></li>
                <li><input type="tel" name="" autocomplete="on"></li>
                <li><input type="date" name="" value=""></li>
                <li><input type="number" name="" min="0" max="145" step="2" ></li>
                <li><input type="color" name="" value=""></li>
                <li><input type="checkbox" name="" value=""></li>
                <li><input type="radio" name="" value=""></li>
                <li><input type="range" name="" value=""></li>
                <li><input type="button" name="" value="按钮"></li>
                <li><input type="reset" name="" value="重置"></li>
                <li><input type="submit" value="提交"></li>
            </ul>
        </form>
    </body>

下面介绍下form表单的必填项 :
action="路径" 向何处发送表单数据;
method="get/post" 如何发送表单数据 ;
name="" 提交到服务器后的表单数据进行标识;

input中有的属性:
type='' 类型;
value='' 表单元素内容;
src='' 路径;
placeholder='' 可描述输入字段预期值的提示信息;
step='' 输入字段的数字间隔;
title='' 提示语(与pattern一起使用);
pattern='/正则/' 用于验证输入字段的模式;
autocomplete='on/off' 输入字段是否应该启用自动完成功能;
min='' 最小值;
max='' 最大值;
autofocus 自动聚焦;
required 使该input为必填项;