形
目的:ユーザー情報の収集
構成:フォームフィールド、フォームコントロール、プロンプト情報
フォームフィールド
フォーム要素情報をサーバー(バックエンド)に送信できます
<form action=地址 method=提交方式 name="name1">
フォーム要素を作成する前に、それらを含めるフォームフィールドが必要です
フォームコントロール
入力
<form>
<!-- text文本框 -->
<!-- maxlength="6" -->
用户名:<input type="text" name="username" value="请输入用户名" maxlength="6"> <br>
<!-- password 是密码框 -->
密码:<input type="password" name="password"> <br>
<!-- 单选按钮和复选框可以设置checked属性,默认选中 -->
<!-- radio单选 单选按钮必须有相同的名字才能单选 -->
性别:男<input type="radio" name="sex" value="男" checked="checked"> 女<input type="radio" name="sex" value="女"> <br>
<!-- checkbox复选框 -->
爱好:吃饭<input type="checkbox" name="hobby" value="吃饭"> 睡觉<input type="checkbox" name="hobby" value="睡觉">
干炮<input type="checkbox" name="hobby" value="干炮" checked="checked">
<!-- 点击了提交按钮,可以把表单域 form 里面的表单元素里面的值提交给后台服务器 -->
<input type="submit" value="免费注册">
<!-- 重置按钮可以还原表单元素初始的默认状态 -->
<input type="reset" value="重新填写">
<!-- 普通按钮,配合js使用 -->
<input type="button" value="获取验证码"> <br>
<!-- 文件域 使用场景 上传文件使用的 -->
上传头像: <input type="file" >
</form>
label:
ユーザーエクスペリエンスを向上させるために要素をバインドするために使用され
ます。Forは、関連する要素のid属性と同じです。
<label for="text"> 用户名:</label> <input type="text" id="text" >
<input type="radio" id="nan" name="sex"> <label for="nan">男</label>
<input type="radio" id="nv" name="sex"> <label for="nv">女</label>
選択する:
<form>
籍贯:
<select>
<option>山东</option>
<option>北京</option>
<option>天津</option>
<option selected="selected">火星</option>
</select>
</form>
textarea:テキスト領域の
特大テキストボックス
<form>
评论:
<textarea cols="50" rows="5">pink老师,我知道这个反馈留言是textarea来做的 </textarea>
</form>
学習ウェブサイト:
www.w3school.com