هنعمل دلوقتي كود لـ Forms HTML كمثال لـ Sign Up Page:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Little Lemon Signup</title>
</head>
<body>
<h1>Sign Up for Little Lemon</h1>
<!-- Start of the signup form -->
<!-- The 'method="post"' sends form data more securely -->
<form method="post" action="#"> <!-- Replace '#' with the actual server endpoint -->
<!-- Div for First Name field -->
<div>
<!-- Label for the first name input, linked via 'for' attribute -->
<label for="user_first_name">First Name</label>
<!-- Line break to put input on the next line -->
<br>
<!-- Input field for first name -->
<!-- type="text" allows any plain text input -->
<!-- name="user_first_name" is the key sent to the server -->
<!-- id="user_first_name" links this input to its label -->
<input type="text" id="user_first_name" name="user_first_name">
</div>
<!-- Div for Last Name field -->
<div>
<!-- Label for the last name input -->
<label for="user_last_name">Last Name</label>
<br>
<!-- Input field for last name -->
<input type="text" id="user_last_name" name="user_last_name">
</div>
<!-- Div for Email field -->
<div>
<!-- Label for the email input -->
<label for="user_email">Email Address</label>
<br>
<!-- Input field for email -->
<!-- type="email" provides basic client-side validation for email format -->
<input type="email" id="user_email" name="user_email">
</div>
<!-- Div for Password field -->
<div>
<!-- Label for the password input -->
<label for="user_password">Password</label>
<br>
<!-- Input field for password -->
<!-- type="password" masks the input characters on the screen -->
<input type="password" id="user_password" name="user_password">
</div>
<!-- Div for Confirm Password field -->
<div>
<!-- Label for the confirm password input -->
<label for="user_confirm_password">Confirm Password</label>
<br>
<!-- Input field for confirming the password -->
<input type="password" id="user_confirm_password" name="user_confirm_password">
</div>
<!-- Div for the Submit button -->
<div>
<!-- Submit button -->
<!-- type="submit" makes this button submit the form -->
<button type="submit">Sign Up</button>
</div>
</form>
<!-- End of the signup form -->
</body>
</html>