Elements in HTML
An HTML file is made up of elements, Elements define the structure and content of webpage.
Every element usually has
Every element usually has
- A starting (opening) tag
- Some content
- An ending (closing) tag
Syntax:
Example:
Output:
Example:
Output:
First <p> tag
<tagname>Content goes here</tagname>
- Opening Tag: Marks the beginning of an element. Ex - <tagname>
- Content: The visible part shown to users. Ex - Content goes here.
- Closing Tag: Ends the element. Ex - </tagname>
NOTE: Some tags like <br> and <img> are self-closing, means they do not need a closing tag.
Example:
<!DOCTYPE html>
<html>
<head>
<title>Quipo House</title>
</head>
<body>
<h1>This is my first Heading</h1>
<p>This is my first Paragraph</p>
<p>This is my <br> second Paragraph</p>
</body>
</html>Output:
| Starting Tag | Content | Ending Tag |
|---|---|---|
| <h1> | This is my first Heading | </h1> |
| <p> | This is my first Paragraph | </p> |
| <p> | This is my second Paragraph | </p> |
| <br> | (Line Break - No Text) | None |
Nested Elements
Nested elements are when you place one HTML tag inside another tag. This is useful for applying style or organizing your content better.Example:
<!DOCTYPE html>
<html>
<head>
<title>Quipo House</title>
</head>
<body>
<p>My first <b>Heading is bold</b></p>
<p>My first<i>Paragraph is italic</i></p>
</body>
</html>Output:
First <p> tag
- <p> is parent tag it defines paragraph to the browser.
- inside <p> tag, we have placed a <b> tag which also called as child of <p> tag.
- <b> tag stands for bold, so the text inside <b> . . . </b> tag will appear in bold.
Second <p> tag
- <p> is parent tag it defines paragraph to the browser.
- inside <p> tag, we have placed a <i> tag which also called as child of <p> tag.
- <i> tag stands for italics, so the text inside <i> . . . </i> tag will appear in italic.