要件:
静的ページは、次のような効果がある実行します。
コードの実装:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>简介</title>
</head>
<body>
<form action="" method="get">
用户名:<input type="text" placeholder="请输入用户名" name="user"><br>
密 码:<input type="password" placeholder="请输入密码" name="pwd"><br>
性别:<label for="male">男</label>
<input type="radio" name="sex" value="male" id="male">
<label for="female">女</label>
<input type="radio" name="sex" value="female" id="female">
<label for="no">保密</label>
<input type="radio" name="sex" value="no" id="no" checked>
<br>
爱好:<label for="sing">唱歌</label>
<input type="checkbox" name="hobby" id="sing" value="sing" checked>
<label for="dance">跳舞</label>
<input type="checkbox" name="habby" id="dance" value="dance">
<label for="draw">画画</label>
<input type="checkbox" name="hobby" id="draw" value="draw">
<br>
上传头像:<input type="file" accept="image/*"><br>
地址:<select name="address" id="address" size="1">
<optgroup label="河南省">
<option value="ZZ">郑州市</option>
<option value="XY">信阳市</option>
<option value="NY">南阳市</option>
</optgroup>
<optgroup label="湖北省">
<option value="WH">武汉市</option>
</optgroup>
<optgroup label="湖南市">
<option value="CS">长沙市</option>
</optgroup>
</select>
<br>
个人简介:<textarea name="introduce" id="introduce" cols="30" rows="10"></textarea><br>
<input type="submit" value="提交">
<input type="reset">
</form>
</body>
</html>
小拡張:
静的な検索ページを実装し、自動的にBaiduのブラウザにジャンプし、自動的に検索します。
コピーし、カジュアルなもののためのBaiduの検索エンジンの検索で公式サイトにアクセスして、URLの左上の部分は、action属性で指定された貼り付ける必要があり、
キーワード検索(美)対応する名前(WD)は、検索ボックスの名前では、属性を属性値。
コードの実装:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="https://www.baidu.com/s" method="get">
搜索:<input type="text" name="wd">
<input type="submit">
</form>
</body>
</html>