Code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ousman Faal 102500</title>
</head>
<body>
<form>
<fieldset>
<legend>Customer Name</legend>
<label for="firstName">First Name:</label>
<input type="text" id="firstName" name="firstName" required><br><br>
<label for="lastName">Last Name:</label>
<input type="text" id="lastName" name="lastName" required><br><br>
</fieldset>
</form>
</body>
</html>
Explaination
The <!DOCTYPE html>
declaration specifies the document type and version of HTML being used, which is HTML5 in this case.
The <html lang="en">
element is the root element of an HTML document. The lang="en"
attribute specifies that the content of the document is in English.
Inside the <html>
element, the <head>
section contains meta-information about the document, such as character set, viewport settings, and the document’s title. The <meta charset="UTF-8">
tag specifies the character encoding for the document, which is UTF-8. The <meta name="viewport" content="width=device-width, initial-scale=1.0">
tag configures the viewport settings to ensure the web page is displayed correctly on different devices.
The <title>
tag sets the title of the web page displayed on the browser’s title bar to “Ousman Faal 102500”.
The <body>
element contains the visible content of the web page. Inside the <body>
, there’s a <form>
element that starts a form section for user input.
Within the <form>
, there’s a <fieldset>
element that groups related input fields together. The <legend>
tag inside the <fieldset>
provides a caption or title for this group of form controls, indicating it’s related to “Customer Name”.
Two <label>
tags with associated <input>
tags are used to create text input fields for the first name and last name. The for
attribute in the <label>
tags links them to the respective <input>
fields using the id
attributes.
Finally, the </form>
, </fieldset>
, </body>
, and </html>
tags close their respective elements, ending the HTML document.
Ousman Faal [Digital Vigilante] is a Tech Entrepreneur & Digital Skills Trainer who teaches both in the classroom and online. He has experience in various technologies and likes sharing it with others. Ousman has published 150 articles on this blog. He is the CEO of Faalen Technologies and Skills.gm.