HTMLでフォームを作成する方法

フォームの作成方法: まず、form タグを使用してフォームを作成し、フォーム フレームを構築します。次に、input タグを使用してテキスト入力ボックスと送信ボタンを作成し、次に select タグと option タグを使用して、ドロップダウン リストを作成し、最後に textarea タグを使用してテキスト領域を作成するだけで十分です。

このチュートリアルの動作環境: Windows7 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。

HTML フォーム

• は、さまざまな種類のユーザー入力を収集するために使用されます。
• フォームはフォーム要素を含む領域です
• フォーム要素を使用すると、ユーザーはテキスト領域 (テキストエリア)、ドロップダウン リスト、ラジオ ボタン (ラジオ ボタン) などのコンテンツをフォームに入力できます。ボタン）、チェックボックスなど。
• フォームはフォーム タグを使用して設定します

HTML フォーム入力要素

• 一般的に使用される form タグは input タグです。
• 入力タイプは、type 属性 (type) によって定義されます。

#テキスト フィールド

<form>
	<h3>用户注册页面</h3>
	用户名:<input name = "username "type = "text"><br />	
</form>

パスワード フィールド

<form>
	密码:<input name = "passwd1" type="password"><br />
	确认密码:<input name = "passwd2" type = "password"><br />	
</form>

ラジオ ボタン

<form>
性别:<input name = "sex" value = "1" type = "radio" >男
     <input name = "sex" value = "0" type = "radio" checked = "checked">女<br />
 </form>

チェックボックス(チェックボックス)

<form>
爱好:<input name = "hobby" type = "checkbox" value="吃饭">吃饭
     <input name = "hobby" type = "checkbox" value="睡觉">睡觉
     <input name = "hobby" type = "checkbox" value="打游戏">打游戏<br />
 </form>

シンプルなドロップダウン リスト

<form>
出生日期:
			<select name = "year" >	
					<option value="2019">2019</optiom>
					<option value="2018">2018</optiom>
					<option value="2017">2017</optiom>
					<option value="2016">2016</optiom>		
			</select>
			<select name = "month">	
					<option value="1">1</optiom>
					<option value="2">2</optiom>
					<option value="3">3</optiom>
					<option value="4">4</optiom>
					<option value="5">5</optiom>	
					<option value="6">6</optiom>
					<option value="7">7</optiom>
					<option value="8">8</optiom>
					<option value="9">9</optiom>
			</select>
			<select name = "day">	
					<option value="1">1</optiom>
					<option value="2">2</optiom>
					<option value="3">3</optiom>
					<option value="4">4</optiom>	
					<option value="5">5</optiom>	
					<option value="6">6</optiom>
					<option value="7">7</optiom>
					<option value="8">8</optiom>
					<option value="9">9</optiom>
					
			</select>	
 </form>

リセット

<form>
<input type="reset" value="重置">
 </form>

送信ボタン

<input type="submit" value="同意以下服务协议，提交注册信息">

Textarea

<textarea name="wenben"></textarea>

完全なコード

	
		
		
	
	
		

		
用户注册页面
		用户名:

		
		
		密码:

		确认密码:

		性别:男
		     女

		爱好:吃饭
			睡觉
			打游戏

		出生日期:
				
					2019
					2018
					2017
					2016		
			
				
					1
					2
					3
					4
					5	
					6
					7
					8
					9
			
				
					1
					2
					3
					4	
					5	
					6
					7
					8
					9AA		
								
		

		      
		<input type="submit" value="同意以下服务协议，提交注册信息">		
		

				
				
		
	

実験結果

[推奨学習:

HTML5 チュートリアル

]

以上がHTMLでフォームを作成する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。