
143 views
HTML5 Tags
HTML5 introduced a variety of new elements and attributes that enhance the structure and semantics of web documents. Here are some of the important HTML5 tags and elements:
- : HTML5 documents start with the
<!DOCTYPE html>
declaration, which specifies the document type and version. <html>
: The root element of an HTML document that encapsulates all the content.<head>
: Contains metadata about the document, such as the document title, character encoding, and linked stylesheets and scripts.<title>
: Specifies the title of the document, which is displayed in the browser’s title bar or tab.<meta>
: Provides metadata about the document, including character encoding, author, and description.<link>
: Used to link external resources like stylesheets or icon files.<style>
: Contains CSS code for styling the document.<script>
: Includes JavaScript code that can be inline or reference an external script file.<base>
: Specifies the base URL for relative URLs within the document.<body>
: Contains the visible content of the document.<h1>
,<h2>
,<h3>
,<h4>
,<h5>
,<h6>
: Heading elements from highest (h1) to lowest (h6) indicating the hierarchy of headings.<p>
: Represents a paragraph of text.<a>
: Creates hyperlinks to other web pages or resources.<img>
: Embeds images in the document.<ul>
,<ol>
,<li>
: Elements for creating unordered and ordered lists, as well as list items.<table>
,<tr>
,<td>
,<th>
,<caption>
: Tags for creating tables, table rows, table data cells, table header cells, and captions.<div>
: A generic container for grouping and styling content.<span>
: A generic inline container for styling content.<section>
: Represents a section of a document, often used for grouping related content.<article>
: Represents a self-contained composition within a document, like a news article or blog post.<header>
and<footer>
: Elements for defining the header and footer of a section or document.<nav>
: Defines navigation menus.<aside>
: Represents content that is tangentially related to the content around it, such as sidebars or advertising.<figure>
and<figcaption>
: Used for grouping media content (e.g., images) and their captions.<audio>
and<video>
: Tags for embedding audio and video content.<canvas>
: Provides a drawing surface for JavaScript to create graphics.<svg>
: Allows for the creation of scalable vector graphics.<form>
and form elements: Used to create interactive forms for user input, including input fields, buttons, and labels.<label>
: Associates a label with a form control for better user experience and accessibility.<input>
: Provides various input types for forms, such as text, password, radio buttons, checkboxes, and more.<textarea>
: Creates a multi-line text input area.<button>
: Represents a clickable button.<select>
and<option>
: Elements for creating dropdown select menus.<details>
and<summary>
: Used to create disclosure widgets that reveal or hide content.<time>
: Represents a specific period in time or a range of time.<progress>
: Displays the completion progress of a task.<meter>
: Represents a scalar measurement within a known range.<mark>
: Highlights text within the document.<datalist>
: Provides a list of predefined options for an<input>
element.<output>
: Represents the result of a calculation or user action.
These are just a selection of the many HTML5 tags and elements that you can use to structure and enrich your web documents. HTML5’s focus on semantics and enhanced multimedia support makes it a powerful tool for modern web development.