WebForm 【简单控件】【表单元素】

一、HTML 表单元素复习

（1）文本类

文本框：<input type="text" name="" id="" value=""/>

密码框：<input type="password" name="" id="" value=""/>

文本框：<textarea name="" id="" cols=""(字符多少)  rows=""(几行高)>        </textarea>

隐藏域：<input type="hidden" name="" id="" value=""/>

（2）按钮类

提交按钮：<input type="submit" name="" id="" disable="disable" value=""/>点击后转到form内的提交服务器地址

重置按钮：<input type="reset" name="" id="" disable="disable" value=""/>

普通按钮：<input type="button" name="" id="" disable="disable" value=""/>

图片按钮：<input type="image" name="" id="" disable="disable" value="" src="图片地址"/>

（3）选择类

单选按钮组：<input type="radio" name="" id="" checked="checked" value=""/>

--  name的值用来分组；value的值看不见，用来提交给程序；checked，设置默认选项

复选框组：<input type="checkbox" name="" id="" checked="checked" value=""/>

下拉列表框：<select name =""  id=""  size=""  multiple="multiple">      -- ize=1时，为菜单；>1时，为列表；multiple为多选。

<option value="值">内容1</option>

<option value="值"  selected="selected">内容2</option>     -- seleted,设为默认

<option value="值">内容3</option>

</select>

文件上传：<input type="file" name="" id="">

--  表单元素在后头用 name 去取值

 --  控件在后台用 ID 取值      

二 、WebForm 中常用好用的简单控件

    Label  

<asp:Label ID="Label1" runat="server" Text="Label">    </asp:Label>

                                                  -- 编译后为 <span>  </span>

<style type="text/css">

.la1 {
            width: 200px;
            height: 50px;
            background-color: red;
           border: 5px solid  navy ;

display: inline-block              -- 变为块状模式
        }

</style>

<asp:Label ID="Label1" runat="server" Text="Label" cssclass=" la1 ">    </asp:Label>

 --  每个控件最终都会被编译成 HTML，可以用样式去修改样式，不要在用控件属性（冗余）

Literal 

<asp:Literal ID="Literal1" runat="server">     </asp:Literal>

                      -- 编译后  空

<asp:Literal ID="Literal2" runat="server" Text = " 内容"  ></asp:Literal>

-- 可以在后台对 JS 进行编写，原封不动的输送到界面上去。

例：在后台

Literal1.Text = " < script > 　alert( ' 失败！')；　< script >"；

　　　　　　　　　　　　　　　　　　　                            　-- 会弹出警告对话框

 TextBox 

  <asp:TextBox ID="TextBox1" runat="server">     </asp:TextBox>

   -- 编译后为 文本框

控件属性

Enabled="false"          禁用

ReadOnly="true"         只读

MaxLength="6"           最大可输入6位数

TexMode="SingLine"     单行  　

                                                        -- 编译后为    文本框

TexMode="PassWord"   密码遮盖

 -- 有此属性编译后为   密码框

TexMode="MultiLine"     多行

　                                                    -- 有此属性编译后为   文本域

 HiddenField 

<asp:HiddenField ID="HiddenField1" runat="server" />

  -- 编译后为  隐藏域

-- 没有 Text属性，内容用 Value。 Value=" 内容 "

 Button 

 <asp:Button ID="Button2" runat="server" Text="Button" />

-- 编译后为   提交按钮

  ImageButton   

<asp:ImageButton ID="ImageButton1" runat="server" />

  -- 编译后为  图片按钮

属性

ImageUrl = " 图片路径 " ;