表單在[網(wǎng)頁(yè)]中主要負(fù)責(zé)[數(shù)據(jù)采集]功能藕届。一個(gè)表單有三個(gè)基本組成部分： 表單標(biāo)簽：這里面包含了處理表單數(shù)據(jù)所用CGI程序的URL以及數(shù)據(jù)提交到服務(wù)器的方法。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表單</title>
<style type="text/css">
</style>
</head>
<body>
<form action="demo075_target.html">
<fieldset>
<legend>用戶信息</legend>
<label for="um">用戶名</label>
<input id="um" type="text" name="username" value="我是value"><br><br>
<label for="pwd">密碼</label>
<input id="pwd" type="password" name="password"><br><br>
</fieldset>
<fieldset>
<legend>用戶愛好</legend>
性別<input type="radio" name="gender" value="male" id="male"><label for="male">男</label>
<input type="radio" name="gender" value="female" checked="checked" id="female"><label for="female">女</label>
<br><br>
愛好<input type="checkbox" name="hobby" value="yy">游泳
<input type="checkbox" name="hobby" value="lq">籃球
<input type="checkbox" name="hobby" value="ymq" checked="checked">羽毛球
<input type="checkbox" name="hobby" value="ppq" checked="checked">乒乓球
<br><br>
</fieldset>
你喜歡的明星
<select name="start">
<optgroup label="女明星">
<option value="lxr">林心如</option>
<option value="zw">趙薇</option>
</optgroup>
<optgroup label="男明星">
<option value="zbs" selected="selected">趙本山</option>
<option value="ldh">劉德華</option>
<option value="zjl">周杰倫</option>
</optgroup>
</select>
<br><br>
自我介紹<textarea name="info"></textarea>
<br><br>
<input type="submit" value="注冊(cè)" />
<input type="reset">
<input type="button" value="按鈕">
<br><br>
<button type="submit">提交</button>
<button type="reset">重置</button>
<button type="button">按鈕</button>
</form>
</body>
</html>
執(zhí)行結(jié)果：
clearfix 是一種 CSS 技巧，可以在不添加新的 html 標(biāo)簽的前提下，解決讓父元素包含浮動(dòng)的子元素的問(wèn)題。
清除浮動(dòng)：
.clearfix:after {
content:"";
display: block;
clear:both;
}
