1.文本框
1.1 語法
<input type = "text">表示文本框。且只能寫一行
1.2 屬性
- 使用屬性size 設置文本框大小
<input type="text" size="10">
2. 使用屬性value 來設置文本框的默認文字
<input type="text" size="30" value = "顯示在文本框里的初始值">
- 使用屬性placeholder來設置文本框的背景文字
<input type="text" size="30" placeholder = "請輸入賬號">
2.密碼框
表示方法：
<input type="password">
使用密碼框時會自動將輸入的內容轉換為星號
3.表單
表單用于搜集不同類型的用戶輸入。
表單的表示方式是<form>
表單用于向服務器提交數據，比如用戶名和密碼等。
表示將數據提交到服務端的login.jsp里面了
<form action="login.jsp">
賬號：<input type="text" name="name"> <br/>
密碼：<input type="password" name="password" > <br/>
<input type="submit" value="登陸">
</form>
提交數據的方式
<form>中提交數據的屬性有兩種，一種是 method=“get” ，一種是method=“post”
- method=“get”
是默認的提交表單數據的方式。如果沒有指定的話一般采用這種
get方式可以在地址欄中看到提交的數據。即使是密碼也可以看到
<form method="get" action="login.jsp">
- method=“post”
post提交表單需要指定
而且使用 post提交表單時不會顯示出密碼
<form method="post" action="login.jsp">
4.單選框
<input type = "radio">表示單選框
<html><body>星期一<input type = "radio">星期二<input type = "radio"> 星期三<input type = "radio">星期四<input type = "radio"> 星期五<input type = "radio">星期六<input type = "radio"> 星期日<input type = "radio">
</body>
</html>
默認選中
默認選中，需要增加屬性checked=“checked” 選項
星期一<input type = "radio" checked="checked" >星期二<input type = "radio"> 星期三<input type = "radio">星期四<input type = "radio"> 星期五<input type = "radio">星期六<input type = "radio"> 星期日<input type = "radio"> 
一堆中只能選中一個
單選框一次能選中好幾個選項，如果想要在一堆單選框里只能選中一個的話，則需要進行分組。
分組需要增加一個屬性name，表示一組數據即name屬性相同。
此時就只能在name相同的屬性里選擇一個了。
<html><body>星期一<input type = "radio" name = "week" checked="checked" >星期二<input type = "radio" name = "week"> 星期三<input type = "radio" name = "week">星期四<input type = "radio" name = "week"> 星期五<input type = "radio" name = "week" >星期六<input type = "radio" name = "week"> 星期日<input type = "radio" name = "week">
</body>
</html>
5.復選框
復選框用<input type= "checkbox">表示
<body><p>這個周哪幾天需要上班？</p>星期一<input type = "checkbox">星期二<input type = "checkbox" > 星期三<input type = "checkbox" >星期四<input type = "checkbox" > 星期五<input type = "checkbox" >星期六<input type = "checkbox" > 星期日<input type = "checkbox" >
</body>
6 下拉列表
在HTML中，下拉列表需要<select><option>兩者配合使用
<select><option>星期一</option><option>星期二</option> <option>星期三</option><option>星期四</option> <option>星期五</option><option>星期六</option> <option>星期日</option></select>
設置下拉列表的高度
在select后增加屬性size
<select size = "7" ><size>
設置下拉列表可以多選
需要使用鍵盤上的shift鍵
在select后增加屬性multiple
<select size = "7" multiple = "multiple"><size>
7.文本域
文本域用<textarea>表示
與文本框不同的是，文本域可以顯示多行數據。
指定長度和寬度
<textarea>增加屬性cols和rows
<html><body><textarea cols = "30" , rows = "7">星期一星期二 星期三星期四 星期五星期六 星期日</textarea>
</body>
</html>
8.普通按鈕
普通按鈕的表示方式是<input type="button">
普通按鈕不能提交表單
<input type="button" value = "普通按鈕">
9.提交按鈕
<input type = "submit">是提交按鈕。可以把數據提交到服務器
<form method="get" action="login.jsp">
賬號：<input type="text" name="name"> <br/>
密碼：<input type="password" name="password" > <br/>
<input type="submit" value="登陸">
</form>
10.重置按鈕
<input type = "reset">是重置按鈕。可以把文本框里的內容清空
<form method="get" action="login.jsp">
賬號：<input type="text" name="name"> <br/>
密碼：<input type="password" name="password" > <br/>
<input type="submit" value="登陸">
<input type="reset" value="重置">
</form>
11.圖像提交
<input type="image" > 是使用圖像作為提交的表示方式
<input type="image" src="picture.jpg">
12 按鈕
<button></button>是按鈕標簽
按鈕標簽中可以是圖片，也可以是文字。
在按鈕標簽中添加屬性type=“submit，那么按鈕也具有提交表單的功能
button中是文字
<button>登陸</button>
button 的圖片屬性
<button><img src="picture.jpg"/>登陸
</button>
button的type屬性
<form method="get" action="login.jsp">
賬號：<input type="text" name="name"> <br/>
密碼：<input type="password" name="password" > <br/>
<button type="submit">登陸</button>
</form>
)
