HTML Tags: A Dive into Common Elements
In the previous article, we explored the basic structure of HTML. Now, let’s delve into some commonly used HTML tags and elements to enhance the content and structure of your web pages.
Headings and Paragraphs In HTML:
Headings are essential for structuring content. As mentioned earlier, HTML provides heading tags <h1> to <h6>. Paragraphs, defined by the <p> tag, are crucial for organizing and presenting text.
Example:
<h1>Main Heading</h1> <p>This is a paragraph of text.</p> <h2>Subheading</h2> <p>Another paragraph here.</p>
Lists In HTML :
HTML offers two types of lists: ordered ( <ol> ) and unordered ( <ul> ). Items within the list are defined using the <li> (list item) tag.
Example:
<ul> <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> </ul> <ol> <li>First</li> <li>Second</li> <li>Third</li> </ol>
Links and Images In HTML:
The <a> tag creates hyperlinks, while the <img> tag embeds images. Both tags use the src attribute to specify the source (URL or file path).
Example:
<a href="https://www.example.com">Visit Example</a> <img src="image.jpg" alt="Description of the image">
Forms in HTML :
Forms are crucial for user input and interaction. Common form elements include <input> , <label> , <select> , and <button> .
Example:
<form> <label for="username">Username:</label> <input type="text" id="username" name="username"> <label for="password">Password:</label> <input type="password" id="password" name="password"> <button type="submit">Submit</button> </form>
Comments In HTML:
You can add comments to your HTML code using <!– Comment here –> . Comments are not visible on the webpage but are useful for explaining your code to others or as reminders for yourself.
Example:
<!-- This is a comment explaining something in the code --> <p>This is a paragraph.</p>
Understanding these fundamental HTML tags provides a strong foundation for building web pages. In the next article, we’ll explore more advanced concepts such as CSS for styling and JavaScript for interactivity.