zoukankan      html  css  js  c++  java
  • 003-html表单

    1.表单域:<form></form>

    2.表单元素

    input标签:

    type="text"文本框

    type="password"密码框

    type="file"上传文件

    type="radio"单选框

     <input type="radio" name = "sex" value="0"><input type="radio" name = "sex" value="1" checked>女
    # 要想单选框的单选功能生效,必须添加name属性,并且name属性的值必须一样,这种无法输入的表单元素必须赋值:value="值",默认选中项使用checked="checked"属性

    type="checkbox"复选框

    # <input type="checkbox" value="0"checked="checked" >(checked="checked"表示默认选择)
    
    <input type="checkbox" checked="checked"><input type="checkbox" ><input type="checkbox" checked="checked"><input type="checkbox">

    type="button"普通按钮

    type="submit"提交按钮

    type="reset"重置按钮

    input新增type属性值(html5):

    type="email",文本框中只能输入email地址

    type="date",日期控件

    type="time"

    type="month"

    type="week"

    type="number",唤醒数字键盘

    type="range",滑块

     type="color"

    下拉框

    # 默认选中项使用selected="selected"
    <select>
        <option>江苏</option>
        <option>浙江</option>
        <option>安徽</option>
    </select>
    
    # 拉菜单可以分组展示
    <select>
            <optgroup label="省份">
                <option value="1">山东省</option>
                <option value="2">河北省</option>
                <option value="3" selected>河南省</option>
            </optgroup>
            <optgroup label="行业">
                <option value="1">IT互联网</option>
                <option value="2">制造业</option>
                <option value="3" selected>零售业</option>
            </optgroup>
            <optgroup label="薪资范围">
                <option value="1">1000~3000元/月</option>
                <option value="2">3000~5000元/月</option>
                <option value="3" selected>5000~8000元/月</option>
            </optgroup>
    </select>

    文本域:<textarea></textarea>

    <textarea rows="5" cols="20">hello,world!</textarea>

    3.表单属性(html5新增)

    required:必填

    placeholder:输入内容提示

    autofocus:自动获取焦点-----自动帮我们将光标点进去

     

  • 相关阅读:
    latex How do I know what symbols/characters are available in a font package
    fun字形
    inspection tool
    msys2 安装 基本配置
    R语言 测试 训练步骤
    R 语言描述性 数据分析 步骤
    如何构建分类模型
    史上最酷的数学动态图
    极大似然估计四个步骤
    react 组件间参数传递
  • 原文地址:https://www.cnblogs.com/kite123/p/14573199.html
Copyright © 2011-2022 走看看