html之表单

作者: 雁儿与安 | 来源:发表于2018-04-07 15:53 被阅读17次

    表单作用:搜集信息;
    组成:提示信息、表单控件、表单线

    <form action="1.php" method="post" maxlength="6(最大长度)" readonly="readonly(只读,不能编辑)" disabled="disabled(输入框未激活:不能编辑)" value="大前端(将输入框内容传给处理文件)">
    用户名:<input type="text" name="userName">
    密码:<input type="password" name="psd">
    提交:<input type="submit">

    性别:<input type="radio(单选框)" name="gender" checked="checked(设置默认选中项)">男
    只有将name的值设置相同时,才能实现单选效果

    表单之下拉列表

    所在地:省(市)<select name="" id="">
                    <optgroup label="北京市">对下拉列表分组
                        <option>下拉列表选项</option>
                        <option>山西</option>
                        <option selected="selected">北京(默认选中项)</option>
                        <option multiple="multiple">多选</option>
                    </optgroup>
    </select>
    

    给表单进行分组

    <form action="">
        <fieldset>
            <legend>分组信息,名称</legend>
        </fieldset>
    </form>
    

    多选框

    <input type="checkbox" checked="checked">同时开通qq空间
    <input type="checkbox">我已阅读并同意相关服务条款和隐私政策
    

    多行文本框

    简介<textarea cols="30" rows="10"></textarea>
    cols:一行字符长度
    rows:行数
    

    文件上传控件

    上传身份证:<input type="file">
    提交:<input type="submit">
    图片按钮:<input type="image" src="1.jpg">
    

    表单重置按钮

    <input type="reset">
    

    网址控件

    <input type="url">
    

    日期控件

    <input type="date">
    

    时间控件

    <input type="time">
    

    邮件控件

    <input type="emil">
    

    数字控件

    <input type="number" step="5">
    

    滑块控件

    <input type="range" step="50">
    

    标签语义化

    好的语义化网站标准:去掉样式表文件之后,结构依然很清晰。

    相关文章

      网友评论

        本文标题:html之表单

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