HTML Elements
HTML (Hypertext Markup Language) consists of a wide variety of elements, each serving a specific purpose in structuring and presenting web content. Understanding these elements is essential for creating well-organized and visually appealing web pages. Here, we'll explore some of the most commonly used HTML elements:
1. <h1>, <h2>, <h3>, <h4>, <h5>, <h6> - Headings
Headings are used to define the hierarchy and importance of different sections within a web page. <h1> represents the highest level of importance, while <h6> represents the lowest.
<h1>This is the Main Heading</h1>
<h2>Subheading 1</h2>
<h3>Subheading 2</h3>
2. <p> - Paragraphs
The <p> element is used for defining paragraphs of text. It separates blocks of content for readability.
<p>This is a paragraph of text.</p>
<p>Another paragraph goes here.</p>
3. <ul>, <ol>, <li> - Lists
Lists are used to organize and present information. <ul> creates unordered (bulleted) lists, <ol> creates ordered (numbered) lists, and <li> defines individual list items.
Unordered List:
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>
Ordered List:
<ol>
<li>First item</li>
<li>Second item</li>
</ol>
4. <a> - Links
The <a> element is used to create hyperlinks that allow users to navigate between web pages or resources.
<a href="https://www.example.com">Visit Example.com</a>
5. <img> - Images
Images are displayed using the <img> element. It requires the src attribute to specify the image source and the alt attribute for alternative text.
<img src="image.jpg" alt="A sample image">
6. <div> - Divisions
The <div> element is a generic container used to group and style content. It's often combined with CSS for applying styles to groups of elements.
<div class="container">
<p>This is a styled container.</p>
</div>
7. <span> - Inline Styling
The <span> element is used for inline styling and is often combined with CSS to apply styles to specific portions of text or elements.
<p>This is <span style="color: blue;">blue text</span> within a paragraph.</p>
8. <br> - Line Break
The <br> element is used to insert line breaks within text, creating manual line breaks when needed.
<p>This text has a line break here.<br>And continues on the next line.</p>
9. <hr> - Horizontal Line
The <hr> element creates a horizontal line, which is often used to separate sections or content on a web page.
<p>Content above the line.</p>
<hr>
<p>Content below the line.</p>
10. <strong> and <em> - Text Formatting
The <strong> element is used for indicating strong importance, often displayed as bold text. The <em> element is used to emphasize text, typically displayed as italic text.
<p><strong>This text is important</strong>, and <em>this text is emphasized</em>.</p>
These are just a few examples of HTML elements. Each element plays a distinct role in organizing and presenting web content. As you continue to explore HTML, you'll discover more elements that cater to various content types and design needs, enabling you to create rich and expressive web pages.