10天學會php第三天表單控制項的使用

昨天我們介紹了html標籤的使用，今天介紹表單控制項的使用，表單控制項常用於網站留言，互動作用。

網站留言

上圖就是網站常見的留言效果，就是在表單的基礎上進行css美化。我們先學習一下最基礎的知識，看看默認的表單是什麼樣子

默認表單控制項

上圖就是默認的表單，常見的表單控制項有input 文本框，password 密碼屬性，單選框radio 多選框select 複選框checkbox

<form name="frm1" id="frm1" action="b.html" method="post">

<input type="button" value="註冊" name="bt1" id="bt1"><!--普通按鈕：javascript綁定-->

<input type="checkbox" name="userLove" value="0">看書<!--複選框-->

<input type="checkbox" name="userLove" value="1">睡覺<!--複選框-->

<input type="checkbox" name="userLove" value="2">吃飯<!--複選框-->

<input type="checkbox" name="userLove" value="3">沒了<!--複選框-->

<input type="file" name="fileUpload"><!--文件上傳控制項-->

<input type="hidden" name="userId"><!--隱藏域：在頁面不會顯示-->

<input type="image" src="images/1.jpg"><!--圖片提交按鈕-->

<input type="password" name="userPwd">

<br>

<input type="radio" value="0" name="userSex" checked="checked">男

<input type="radio" value="1" name="userSex">女

<input type="radio" value="2" name="userSex">其他

<input type="submit" value="提交按鈕"><!--提交按鈕-->

<input type="reset" value="重置"><!--重新初始化到默認狀態-->

<input type="text" name="userName"><!--文本框-->

<br><br>

非input元素

<textarea cols="60" rows="10"></textarea>

<select name="userPro">

<option value="0">北京</option>

<option value="1" selected="selected">上海</option>

<option value="2">天津</option>

</select>

<select name="userPro" multiple="multiple">

<option value="0">北京</option>

<option value="1" selected="selected">上海</option>

<option value="2">天津</option>

</select>

</form>

我們可以創建一個html文件，粘貼上面html代碼看看默認的表單樣子。也可以在W3CSCHOOL上面看更多表單的屬性，比如文本框設置不可編輯，怎麼單選框默認被選中，城市三級聯動效果實現等。

然後在介紹一個知識點frameset的應用，這個常用於網站後臺的管理界面搭建（有點類似T型結構）

介紹一下原理

frameset應用

主要引用其他幾個文件 ，通常是header.html,left.html,main.html 下面是index的代碼

<frameset rows="100,*" frameborder="0">

<frame src="a.htm" name="userA">

<frameset cols="100,50,*">

<frame src="b.htm" name="userB">

<frame src="c.htm" name="userC">

<frame src="a.htm" name="userC">

</frameset>

</frameset>

下圖是常見案例

frameset應用

今天作業是完成下圖用戶註冊代碼實現

用戶註冊