星空网 > 软件开发 > 网页设计

HTML5中表单的创建

一、常用表单标签如下:

 (1)<input>中的“type”属性:

   复选框-checkbox;单选按钮-radio;按钮-button;提交-submit;

(2)文本域

  行-cols;列-rows;

  

<form>表单
<input>输入域
<textarea>文本域
<label>控制标签
<fieldset>定义域
<legend>域的标题
<select>选择列表
<optgroup>选项组
<option>下拉列表中的选项
<button>按钮

 二、常见表单标签的应用

  1、输入用户名以及密码表单的制作

    (1)主要代码:

        <form>
              用户名:<input type="text" />
                密码:<input type="password" />
                <br />
         </form>

    (2)实现效果:

HTML5中表单的创建

 

  2、复选框的使用:

    (1)主要代码:

     <form>
            你喜欢的水果有?<br />
            苹果<input type="checkbox" />
            西红柿<input type="checkbox" />
            香蕉<input type="checkbox" />
            菠萝<input type="checkbox" />
     </form>

    (2)实现效果:

HTML5中表单的创建

 

  3、单选按钮的使用:

    (1)主要代码:

      <form>

       请选择您的性别:
            男<input type="radio"  name="sex"/>
            女<input type="radio" name="sex"/>
      </form>

    (2)实现效果:

 HTML5中表单的创建

  4、下拉列表的使用

    (1)主要代码

      <form>

         <select>
                <option>www.baidu.com</option>
                  <option>www.jikexueyuan.com</option>
                  <option>www.google.com</option>
              </select>

      </form>

    (2)实现效果

 HTML5中表单的创建

  5、按钮的使用

    (1)主要代码

      <form>

       <input type="button" value="按钮" /><br />     //“value”用来定义按钮上面的值
            <input type="submit" /> <br />
            <input type="reset" /><br /><br />        //”reset“用来重置表单里的内容
       </form>

    (2)实现效果

HTML5中表单的创建

  

 

 

 

6、文本框的使用

    (1)主要代码

      <textarea cols="10" rows="15">在此输入文字</textarea>

    (2)实现效果

HTML5中表单的创建

 




原标题:HTML5中表单的创建

关键词:HTML

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。
相关文章
我的浏览记录
最新相关资讯
海外公司注册 | 跨境电商服务平台 | 深圳旅行社 | 东南亚物流