HTML tags (for beginner)
Tags: html, tags, beginners
Published: 2021-09-21 10:03:25

In this post, I will describe the HTML tags a bit to better remember them.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/knonnwro2rkvklviepde.png)

- __b__ Defines bold text.

- __strong__ Defines important text.

- __<!--...-->__ Defines a comment.

- __<!DOCTYPE>__ Defines the document type.

- __html.../html__ Defines the root of an HTML document.
- __head.../head__ is a container for metadata. (data about data) and is placed between the _html_ tag and the _body_ tag.
    - __title.../title__ (required in every HTML document)
    - __style.../style__
    - __base__
    - __link__
    - __meta__
        - Define keywords for search engines.
        
        _meta_ _name_="keywords" _content_="HTML, CSS, JavaScript"
        - Define a description of your web page.

        _meta_ _name_="description" _content_="Free Web tutorials for HTML and CSS"
        - Define the author of a page.

        _meta_ _name_="author" _content_="John Doe"
        - Refresh document every 30 seconds.

        _meta_ _http-equiv_="refresh" _content_="30"
        - Setting the viewport to make your website look good on all devices.

        _meta_ _name_="viewport" _content_="width=device-width, initial-scale=1.0"
    - __script.../script__
    - __noscript.../noscript__
- __title.../title__ defines the title of the document. The title must be text-only, and it is shown in the browser's title bar or in the page's tab.

- __body.../body__ Defines the document's body.

- __h1-h6.../h1-/h6__ Defines HTML headings.

- __div.../div__ Defines a section in a document.

- __span.../span__ Defines a section in a document. _Span_ is an inline container used to mark up a part of a text, or a part of a document.
    __!!!__The _span_ tag is much like the _div_ element, but _div_ is a block-level element and _span_ is an inline element.

- __img__ is used to embed an image in an HTML page 
   __img__ __src__="img_girl.jpg" __alt__="Girl in a jacket" __width__="500" __height__="600"
    - _src_ Specifies the path to the image.
    - _alt_ Specifies an alternate text for the image, if the image for some reason cannot be displayed.
    - _width/height_ Specifies the width/height of an image.

- __br__ Defines a single line break.

- __hr__ Defines a thematic change in the content.

- __a__ Defines a hyperlink.
    - _href_ specifies the URL of the page the link goes to;
    - _target_ (_blank/_parent/_self/_top) specifies where to open the linked document;

- __form__ is used to create an HTML form for user input.
    - __label__ defines a label for several elements. __Why to use:__ 
__1.___Screen reader users (will read out loud the label, when the user is focused on the element)._
__2.___Users who have difficulty clicking on very small regions (such as checkboxes) - because when a user clicks the text within the <label> element, it toggles the input (this increases the hit area)._ 
        - _for_ Specifies the id of the form element the label should be bound to;
        - _form_ Specifies which form the label belongs to;
    - __input__ specifies an input field where the user can enter data;
        - _type_
            - "button"
            - "checkbox"
            - "color"
            - "date"
            - "datetime-local"
            - "email"
            - "file"
            - "hidden"
            - "image"
            - "month"
            - "number"
            - "password"
            - "radio"
            - "range"
            - "reset"
            - "search"
            - "submit"
            - "tel"
            - "text" (default value)
            - "time"
            - "url"
            - "week"
    - __select__ is used to create a drop-down list
        - _name_ is needed to reference the form data after the form is submitted;
        - _id_ is needed to associate the drop-down list with a label;
        - _multiple_ Specifies that multiple options can be selected at once;
        - _required_ Specifies that the user is required to select a value before submitting the form;
    - __option__ defines an option in a select list;
        - _value_ Specifies the value to be sent to a server;
        - _selected_ Specifies that an option should be pre-selected when the page loads;
    - __textarea__ defines a multi-line text input control;
        - _rows/cols_ is specified the size of a text area;
        - _name_ is needed to reference the form data after the form is submitted;
        - _id_ is needed to associate the text area with a label;
        - _placeholder_ Specifies a short hint that describes the expected value of a text area;
    - __button__ defines a clickable button.
        - _type_ to tell browsers what type of button it is;
            - "button"
            - "reset"
            - "submit"