• form表单中的常用控件


        <form action="#" method="post">
            placeholder:输入表单是提供一个提示
            <input type="text" value="" name="text" placeholder="placeholder提供一个提示"/><br />
            required:这个属性可以用于任何表单控件,它指示一个域是必要的,所有对于设置了这个
                      属性的控件,如果没有为这个控件指定一个值,就无法正常提交表单。
                      在支持这个属性的浏览器中,如果没有为required属性的域指定一个值,提交表单时
                      你会得到一个错误消息,表单不会提交到服务器。
            <input type="text" placeholder="提示信息" required />
            <br />
    
            文本输入框:<input type="text" value="" name="text" /><br />
            密码输入框:<input type="password" value="123456" /><br />
            文件上传控件:<input type="file" /><br />
            单选按钮:
            <input type="radio" name="radio" id="radioA" value="单选" checked/><label for="radioA">单选一</label>
            <label><input type="radio" name="radio" value="不选" />单选二</label> 
            <br />
    fieldset:设置一个分组,legend是一个标题 <fieldset> <legend>多选框</legend> <label><input type="checkbox" name="checkbox" value="多选一" />多选一</label> <label><input type="checkbox" name="checkbox" value="多选二" />多选二</label> </fieldset> <br /> 多选列表控件: <select multiple> <option>襄阳</option> <option>武汉</option> <option>长沙</option> <option>岳阳</option> </select> <br /> 下拉列表:
    optgroup是设置一个选项分组
    <select> <optgroup label="湖北省"> <option>襄阳</option> <option>武汉</option> </optgroup> <optgroup label="湖南省"> <option>长沙</option> <option>岳阳</option> </optgroup> </select> <br /> 文本区: <textarea rows="10" cols="40"></textarea> <br /> 数字输入:<input type="number" min="0" max="20" /> <br /> 范围输入: <input type="range" min="0" max="30" step="1" value="2"/> <br /> 颜色输入: <input type="color" /> <br /> 日期: <input type="date" /> <br />
    Email输入: <input type="email" /> <br /> Tel输入: <input type="tel" /> <br /> URL输入: <input type="url" /> <br />
    type属性为email、tel、url时,与text没太大变化,是text的一个变种。不过在移动设备上可以看出效果,比如tel值,移动设备检测到后会默认显示数字键盘
    </form>

    例子样式:

     

  • 相关阅读:
    Spring Data JPA 的作用.
    JavaEE 规范和 SSH 三大框架的关系
    一些疑惑
    Linux学习总结(21)——CentOS7环境下FTP服务器的安装和配置
    Docker学习总结(18)——阿里超大规模Docker化之路
    Maven学习总结(32)——Maven项目部署到Tomcat8中
    Maven学习总结(31)——Maven坐标详解
    猎豹CEO傅盛:与周鸿祎、雷军、马化腾、马云的的相爱相杀
    Java Web学习总结(32)——Java程序员最亲睐的Web框架
    VMWare学习总结(1)——Centos7安装完毕后无法联网的解决方法
  • 原文地址:https://www.cnblogs.com/wind-wang/p/6062451.html
Copyright © 2020-2023  润新知