表單中的元素

2012/11/26 10:47:25作者：佚名來源：網(wǎng)絡(luò)

移動(dòng)端

【實(shí)例介紹】

表單中的元素
網(wǎng)頁(yè)中的表單由許多不同的表單元素組成。這些表單元素包括文字字段、單選按鈕、復(fù)選
框、菜單和列表以及按鈕等。

【實(shí)例代碼】


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無(wú)標(biāo)題文檔</title>
</head>
<style>
body{font-family:"Lucida Grande", "Lucida Sans Unicode", 
Verdana, Arial, Helvetica, sans-serif;
    font-size:12px;}
h1, form, button{border:0; margin:0; padding:0;}
</style>
<body>
<h1>填寫會(huì)員注冊(cè)資料</h1>
<form>
會(huì)員名:<input type="text" /><br />
登錄密碼:<input type="password" /><br />
性別:
<input type="radio" />男
<input type="radio" />女<br />
婚姻狀況:<input type="checkbox" />已婚<br />
相片:<input type="file" /><br />
<input type="submit" value="注冊(cè)" />
 <input type="reset" value="重設(shè)" /></form>
</body>
</html>

【代碼分析】

上面表單的源代碼主要包括<form>、<input>、<select>、<option>等幾個(gè)標(biāo)簽，并且定義了
CSS來設(shè)置表單元素中的字體大小和樣式，在瀏覽器中預(yù)覽效果，如圖15．7所示。

表單中的元素
【素材及源碼下載】