HTML (Hypertext Markup Language) uses elements and tags to structure content on the web. Elements are the building blocks of HTML, and they are represented by tags. Tags are enclosed in angle brackets and come in pairs—an opening tag and a closing tag. The content to be affected is placed between these tags. Here’s an overview of common HTML elements and tags:
1. Text Elements:
- Paragraph:
<p>
…</p>
<p>This is a paragraph.</p>
- Headings (h1 to h6):
<h1>
…</h6>
<h1>Main Heading</h1>
<h2>Subheading</h2>
- Bold:
<strong>
…</strong>
<p>This is <strong>bold</strong> text.</p>
- Italic:
<em>
…</em>
<p>This is <em>italic</em> text.</p>
- Line Break:
<br>
<p>This is the first line.<br>This is the second line.</p>
2. Lists:
- Unordered List:
<ul>
…</ul>
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>
- Ordered List:
<ol>
…</ol>
<ol>
<li>Item 1</li>
<li>Item 2</li>
</ol>
- List Item:
<li>
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>
3. Links and Images:
- Link:
<a href="URL">...</a>
<a href="https://www.example.com">Visit Example</a>
- Image:
<img src="image.jpg" alt="Description">
<img src="picture.jpg" alt="A beautiful landscape">
4. Forms:
- Form:
<form>
…</form>
<form action="/submit" method="post">
<!-- form elements go here -->
</form>
- Input:
<input type="text" name="username">
<label for="username">Username:</label>
<input type="text" id="username" name="username">
- Button:
<button>
…</button>
<button type="submit">Submit</button>
5. Semantic Elements:
- Header:
<header>
…</header>
<header>
<h1>Website Title</h1>
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/about">About</a></li>
</ul>
</nav>
</header>
- Main Content:
<main>
…</main>
<main>
<h2>Main Content</h2>
<p>This is the main content of the page.</p>
</main>
- Footer:
<footer>
…</footer>
<footer>
<p>© 2023 Example Company</p>
</footer>
These are just a few examples of HTML elements and tags. HTML provides a wide range of elements to structure and present content on the web. Understanding how to use these elements is essential for creating well-designed and functional web pages.