Html-表单元素

表单的标记<form></form>  

属性:

  name:表单的名字

  action=“url” 提交地址

  method 提交的方式

    get

    post

  target 在什么位置打开

常用的表单元素

  1.<input type="#" name="">:

      text:文本框

      password:密码框

      radio:单选框

      checkbox:复选框

      file:文件域

      submit:提交按钮

      reset:重置按钮

      button:普通按钮

      image:图像域按钮

      hidden:隐藏域  

 

text文本框

  <input type="text" value="你好" >

  输入的类型             初始值

  placehold=字体变虚且可直接输入

<form action="sss" name="form1" method="get">
    <input type="text"  value="admin" placeholder="请输入用户名" name="login" >
    <input type="password" value="123456" placeholder="请输入密码" name="pwd">
    <input type="submit" value="提交">

</form>

password密码框

  属性:

    type   表单对象类型

    如:<input type="password">

 

radio单选框

  属性:

    name   文本字段的名称(不可缺少)

    checked   默认选中

  <input type="radio" name="sex" checked=“true”>男

  输入类型                    name为同一组为sex    checked可以写=“true” 也可以不写

  单选同一组不可以设置不同的名称

   <!--当name相同的时候为同一组,如果点击男女就不选中,不在一个组的时候都可以选中-->
   <input type="radio" name="性别" checked><input type="radio" name="性别">

checkbox复选框

  属性:

      type:表单对象类型

      checked:默认选中

    <input type="checkbox" checked >上网<input type="checkbox">游戏<input type="checkbox">电玩

file 文件域

  <input type="file">  浏览或上传文件的控件

    <input type="file" >

下拉菜单

  <select>

    <option>请选择您的学历</option>

    <option selected> 高中</option>

  </select>

  mulitple多选属性

    

<!--在select标签中加上Mulitiple就表示是多选项按住ctrl多选-->
    <select multiple>
        <option selected>请选择您的学历</option>
        <option  >高中</option>
        <option >大学</option>
    </select>

textarea 文本域(多行文本框)

  属性:

    cols:列数

    rows:行数

四中按钮

  提交、重置

    <input type="submit" value="提交" >
    <input type="reset" value="重置" >

普通按钮、图像域

        <input type="button" value="确定">
        <input type="image" src="fengj.jpg">  图像按钮

label文本标签

  <lable>用户名:</label>

 

 

 

 

 

  

posted @ 2018-09-21 09:51  WhiteSpace  阅读(189)  评论(0编辑  收藏  举报