본문으로 건너뛰기

Attributes

HTML Attributes

HTML attributes consist of names and values that provide additional information to HTML elements.

Attributes are written in the start tag, and multiple attributes can be applied to a single HTML element.


Basic Structure of Attributes

HTML attributes are included within the start tag and are written in the format of name="value".

HTML Attribute Structure
<element attribute_name="attribute_value"> ... </element>

Example:

Example of img tag attributes
<img src="image_path.jpg" alt="description of the image" />

The "src" attribute is a required attribute for the <img> tag. An img tag without a defined src attribute will not display an image.


Examples of Key Attributes

  1. Common HTML Tags: class, id attributes

    Just as every person is distinguished by a name and social security number, web pages use the class and id attributes to distinguish specific elements and apply styles.

    • class: Used to apply the same style to multiple elements. You can assign the same class name to multiple elements.
      Example of class attribute
      <div class="highlight">Applying the highlight class</div>
    • id: Used to differentiate specific elements or select a particular element with JavaScript. The id value must not be duplicated among other HTML elements.
      Example of id attribute
      <div id="main-content">HTML element with the main-content ID</div>

  1. img Tag: src and alt attributes

    The img element uses the src attribute to specify the path to the image and the alt attribute for alternative text.

    img tag src and alt attributes
    <img src="https://picsum.photos/id/237/200/300" alt="dog" />

  1. a Tag: href attribute

    The a element uses the href attribute to specify the destination URL for the link to another page.

    a tag href attribute
    <a href="https://www.example.com">Visit the Website</a>

Follow the parts emphasized with asterisks in the code to try it out.