Thursday, June 13, 2024

HTML All Tags

 

Common HTML Tags and Elements


Basic Tags

  • <!DOCTYPE html>: Declares the document type and version of HTML.
  • <html>: Root element of an HTML document.
  • <head>: Contains meta-information about the document.
  • <title>: Sets the title of the document.
  • <body>: Contains the content of the document.


Text Formatting Tags


  • <h1> to <h6>: Headings, with <h1> being the highest (or most important) and <h6> the lowest.
  • <p>: Paragraph.
  • <br>: Line break (self-closing).
  • <hr>: Horizontal rule (self-closing).
  • <strong>: Important text (bold).
  • <em>: Emphasized text (italic).
  • <b>: Bold text.
  • <i>: Italic text.
  • <u>: Underlined text.
  • <small>: Smaller text.
  • <mark>: Highlighted text.
  • <blockquote>: Long quotation.
  • <code>: Inline code snippet.
  • <pre>: Preformatted text.

Lists

  • <ul>: Unordered list.
  • <ol>: Ordered list.
  • <li>: List item.
  • <dl>: Description list.
  • <dt>: Description term.
  • <dd>: Description detail.

Links and Images

  • <a>: Anchor (hyperlink).
  • <img>: Image (self-closing).
  • <map>: Image map.
  • <area>: Defines an area inside an image map (self-closing).

Tables

  • <table>: Table.
  • <tr>: Table row.
  • <td>: Table cell.
  • <th>: Table header cell.
  • <thead>: Table head.
  • <tbody>: Table body.
  • <tfoot>: Table footer.
  • <caption>: Table caption.

Forms

  • <form>: Form.
  • <input>: Input field (self-closing).
  • <textarea>: Multiline input field.
  • <button>: Button.
  • <select>: Drop-down list.
  • <option>: Option in a drop-down list.
  • <label>: Label for a form element.
  • <fieldset>: Group related elements in a form.
  • <legend>: Caption for a <fieldset>.

Sections

  • <header>: Introductory content or navigation links.
  • <nav>: Navigation links.
  • <main>: Main content.
  • <section>: Section of content.
  • <article>: Independent, self-contained content.
  • <aside>: Content aside from the main content.
  • <footer>: Footer for a section or page.

Multimedia

  • <audio>: Audio content.
  • <video>: Video content.
  • <source>: Media source (self-closing).
  • <track>: Text tracks for media elements (self-closing).

Embedded Content

  • <iframe>: Inline frame.
  • <embed>: Embedded content (self-closing).
  • <object>: External resource.
  • <param>: Parameters for an <object> (self-closing).

Miscellaneous

  • <div>: Generic container.
  • <span>: Generic inline container.
  • <script>: Client-side script.
  • <noscript>: Alternative content for users with disabled scripts.
  • <style>: Embedded CSS.
  • <link>: External resource link (self-closing).
  • <meta>: Metadata about the HTML document (self-closing).
  • <base>: Base URL for relative URLs.

Common HTML Attributes

Global Attributes (can be used on most HTML elements)


  • class: Specifies one or more class names for an element (used for CSS).
  • id: Specifies a unique id for an element.
  • style: Specifies an inline CSS style.
  • title: Specifies extra information about an element (displayed as a tooltip on hover).
  • lang: Specifies the language of the element's content.
  • dir: Specifies the text direction (ltr for left-to-right or rtl for right-to-left).

Attributes for Links

  • href: Specifies the URL of the link.
  • target: Specifies where to open the linked document (_blank for a new tab).

Attributes for Images

  • src: Specifies the path to the image.
  • alt: Specifies alternative text for the image.
  • width: Specifies the width of the image.
  • height: Specifies the height of the image.

Attributes for Forms and Input

  • action: Specifies the URL to send form data to.
  • method: Specifies the HTTP method to use when sending form data (get or post).
  • type: Specifies the type of input (text, password, submit, etc.).
  • name: Specifies the name of an input element.
  • value: Specifies the initial value of an input element.
  • placeholder: Specifies a short hint that describes the expected value of an input field.
  • checked: Specifies that an input element should be pre-selected when the page loads (for checkboxes and radio buttons).
  • disabled: Specifies that an input element should be disabled.
  • readonly: Specifies that an input field is read-only.

Attributes for Tables

  • colspan: Specifies the number of columns a table cell should span.
  • rowspan: Specifies the number of rows a table cell should span.

Attributes for Multimedia

  • controls: Specifies that audio/video controls should be displayed.
  • autoplay: Specifies that the media should start playing as soon as it is loaded.
  • loop: Specifies that the media should start over again, every time it is finished.
  • muted: Specifies that the audio output of the video should be muted.
  • poster: Specifies an image to be shown while the video is downloading or until the user hits the play button.







By at

No comments:

Post a Comment

Subscribe to: Post Comments (Atom)