4.10. Introduction to HTML: basic structure, tags and attributes: HTML Forms
Page 14 | Listen in audio
Introduction to HTML: Basic Structure, Tags and Attributes: Forms in HTML
The HTML language (Hyper Text Markup Language) is the basis for creating any website on the web. It is a markup language, which means it is used to structure content in a document, but not to program behaviors or styles. For this, we use other languages such as CSS and JavaScript. In this chapter, we will focus on understanding the basic structure of an HTML document, the most common tags, and how to use attributes. In addition, we will also learn about creating HTML forms.
Basic structure of an HTML document
Every HTML document begins with the document type declaration, which tells the browser what type of document it is reading. For HTML5, the latest version of HTML, the declaration is simply . After that, the HTML document is divided into two main parts: the head and the body. The head contains metadata about the document, such as the title that appears in the browser tab, and links to CSS stylesheets or JavaScript scripts. The body contains the actual content of the site, which is what users see and interact with.
Example of the basic structure of an HTML document:
<!DOCTYPE html>
<html>
<head>
<title>Site title</title>
</head>
<body>
Website content
</body>
</html>
HTML Tags
HTML tags are used to mark up and categorize content in an HTML document. Each tag begins with a angle bracket (<) and ends with an angle bracket (>). Most tags have an opening tag and a closing tag, with the content in between. The closing tag is the same as the opening tag, but it has a slash (/) before the tag name.
Example of using HTML tags:
<p>This is a paragraph.</p>
<h1>This is a level 1 header.</h1>
<a href="https://www.example.com">This is a link.</a>
HTML Attributes
Attributes are used to provide additional information about an HTML element. They are included in the opening tag and consist of an attribute name and an attribute value. The attribute value must be enclosed in quotation marks.
Example of using HTML attributes:
<a href="https://www.example.com" target="_blank">This is a link that opens in a new tab.</a>
<img src="image.jpg" alt="Image description">
HTML Forms
Forms are an important part of any website as they allow users to enter information and interact with the website. A form is created using the <form> tag, and within the form we use different tags for different types of input fields, such as <input>, <textarea>, <select>, etc. Each input field can have attributes to control its behavior, such as type, name, value, etc.
Example of an HTML form:
<form action="/submit_form" method="post">
<label for="name">Name:</label>
<input type="text" id="name" name="name">
<label for="email">Email:</label>
<input type="email" id="email" name="email">
<input type="submit" value="Submit">
</form>
Now answer the exercise about the content:
What is the function of the "head" tag in an HTML document?
You are right! Congratulations, now go to the next page
You missed! Try again.
Next page of the Free Ebook:
15Introduction to HTML: basic structure, tags and attributes: Input tags
4 minutes
Earn your Certificate for this Course for Free! by downloading the Cursa app and reading the ebook there. Available on Google Play or App Store!
