By GokiSoft.com| 20:38 29/08/2022|

Học HTML5 - CSS3

Thiết kế Form đăng ký tài khoản bằng HTML5/CSS - Thiết kế registation form HTML5/CSS

Phản hồi từ học viên

5

(Dựa trên đánh giá ngày hôm nay)

Nguyễn Hải Long

2021-12-29 13:25:25

https://gnoliah97.github.io/1578-Gokisoft/index.html

Vũ Trung Kiên

2020-12-10 14:08:49

#EasyJob.html

<!DOCTYPE html>
<html>
<head>
	<title>EasyJobs4You</title>
	<meta charset="utf-8">
	<style type="text/css">
		.row
		{
			display: flex;
		}
		label
		{
			width: 200px;
			height: 20px;
			float: left;
			padding-left: 10px;
			padding-top: 10px;	
		}
		button {
			margin-left: 20px;
			margin-top: 10px;
		}
	</style>
</head>
<body>
	<h1>
		Registration Form - Job Seekers
	</h1>
	<div class="row">
		<label>
			Login Name:
		</label>
		<input type="text" name="LoginName">
	</div>
	<div class="row">
		<label>
			Password:
		</label>
		<input class="Password" type="Password" name="Password">
	</div>
	<div class="row">
		<label>
			Re-enter Password:
		</label>
		<input type="Password" name="Password">
	</div>
	<div class="row">
		<label>
			Gender
		</label>
		<input type="radio" name="Gender">
		Male
		<input type="radio" name="Gender">
		Female
	</div>
	<div class="row">
		<label>
			Experience (In Years):
		</label>
		<select>
			<option>Select...</option>
			<option>0-1</option>
			<option>1-2</option>
			<option>2-3</option>
			<option>3+</option>
		</select>
	</div>
	<a href="thankyou.html"><button>Register</button></a>
	<button>Cancel</button>
</body>
</html>

#thankyou.html

<!DOCTYPE html>
<html>
<head>
	<title>EasyJobs4You</title>
</head>
<body>
	<h1>
		Thank you for registering on EasyJobs4You.
	</h1>
</body>
</html>

Dao Quoc Huy

2020-12-10 08:39:23

https://huy12.herokuapp.com/EmailEditor.html

Lê Sĩ Tuyển

2020-12-10 08:30:26

EasyJobsForYou (tuyen6tuoi.herokuapp.com)

Nguyễn Hải Đăng

2020-12-09 18:42:42

https://newlevel06.herokuapp.com/Day%204/Job.html

nguyen hoang viet

2020-12-09 17:01:55

https://nguyenhoangviet.herokuapp.com/easyjob.html

silentvoice

2020-12-09 11:48:17

https://phamngoclong.herokuapp.com/baitaplab4/form/ezjob.html

Nguyễn Hữu Hiếu

2020-10-14 15:28:54

#1578.html

<!DOCTYPE html>
<html>
<head>
	<title>EasyJobs4You</title>
	<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
	<h2>Registration Form - Job Seekers</h2>
	<div class="form">
		<div class="text">Login Name:</div>
		<div class="textbox">
			<input type="text" name="login">
		</div>
	</div>

	<div class="form">
		<div class="text">Password:</div>
		<div class="textbox">
			<input type="Password" name="login">
		</div>
	</div>

	<div class="form">
		<div class="text">Re-enter Password:</div>
		<div class="textbox">
			<input type="Password" name="login">
		</div>
	</div>	

	<div class="form">
		<div class="text">Gender:</div>
		<div class="textbox">
			<input type="radio" name="checkout">Nam
			<input type="radio" name="checkout">Nu
		</div>
	</div>

	<div class="form">
		<div class="text">Experience (In Years):</div>
		<div class="textbox">
			<select>
				<option>Select</option>
				<option>0-1</option>
				<option>1-2</option>
				<option>2-3</option>
				<option>3+</option>
			</select>
		</div>
	</div>
	<a href="rs.html"><button>Register</button></a> <button>Cancel</button>

</body>
</html>

#rs.html

<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
	<h2>Thank you for registering</h2>
	<h2>EasyJobs4You</h2>
</body>
</html>

#style.css

.form {
	display: flex;
}
.text {
	width: 150px;
	float: left;
	padding-left: 10px;
	padding-top: 10px;
}
.textbox {
	float: left;
	padding-left: 30px;
	padding-top: 10px;
}
button {
	margin-left: 20px;
	margin-top: 10px;
}