HTML Tags

       No comments

 



What is an HTML Tag?

  • HTML Tags are the basic building block of elements in HTML. 
  • tags start with open (< ) and closing  ( > ) brackets. Inside the opening and closing brackets, we will have some content that is called an HTML element
example:


<h1>Headingh1</h1>



Commonly used tags in HTML

Document Structure Tags

  1. <!DOCTYPE html>: Specifies the document type.
  2. <html>: Encloses the entire HTML document.
  3. <head>: Contains meta-information and links to scripts and stylesheets.
  4. <body>: Contains the content of the web page.

Metadata Tags

  1. <title>: Sets the title of the web page.
  2. <meta>: Provides metadata such as character set, author, and viewport settings.
  3. <link>: Links external resources like stylesheets.

Text Formatting Tags

  1. <p>: Paragraph.
  2. <h1>, <h2>, <h3>, <h4>, <h5>, <h6>: Headings.
  3. <strong>: Strong emphasis (typically bold).
  4. <em>: Emphasis (typically italic).
  5. <br>: Line break.
  6. <hr>: Horizontal rule.

List Tags

  1. <ul>: Unordered list.
  2. <ol>: Ordered list.
  3. <li>: List item.

Hyperlink and Media Tags

  1. <a>: Anchor (used for links).
  2. <img>: Image.
  3. <audio>: Audio content.
  4. <video>: Video content.
  5. <figure>
  6. <picture> 

Form Tags

  1. <form>: Form.
  2. <input>: Input field.
  3. <textarea>: Text area.
  4. <button>: Button.
  5. <select>: Dropdown list.
  6. <option>: Options within a <select> or <datalist>.

Table Tags

  1. <table>: Table.
  2. <tr>: Table row.
  3. <td>: Table data cell.
  4. <th>: Table header cell.
  5. <thead>: Table header group.
  6. <tbody>: Table body group.
  7. <tfoot>: Table footer group.

Semantic Tags

  1. <header>: Header section.
  2. <footer>: Footer section.
  3. <article>: Article.
  4. <section>: Section.
  5. <nav>: Navigation.
  6. <aside>: Sidebar content.

Types of HTML tags

  • Paired
  • Unpaired

1. Paired Tags

  • Paired tags are opening tags and closing tag is called paired tags.
Examples

  • Paragraphs: <p>This is a paragraph.</p>
  • Headings: <h1>This is a heading.</h1> 

2. Unpaired Tags (Self-Closing Tags or Stand-Alone Tags)

  • These are tags that don't require a closing tag. 
  • They are self-contained, encapsulating all the information within a single tag.
  • Self-Closing Tag: A self-closing tag starts with < and ends with /> (though the / is optional in HTML5).

Examples of self-closing tags:

  • Line Break: <br/>
  • Horizontal Rule: <hr/>
  • Image: <img src="image.jpg" alt="An example image"/>

0 Comments:

Post a Comment

Do leave your comments