HTML Basics

HTML Attributes

Learn how HTML attributes provide additional information about elements and how to use them effectively.

HTML Attributes

HTML attributes provide additional information about HTML elements. All HTML elements can have attributes and they are always specified in the start tag. Attributes usually come in name/value pairs like: name="value".

The href Attribute

The <a> tag defines a hyperlink. The href attribute specifies the URL of the page the link goes to:

<a href="https://devforgeacademy.com">Visit DevForge Academy</a>

The src Attribute

The <img> tag is used to embed an image in an HTML page. The src attribute specifies the path to the image to be displayed:

<img src="img_girl.jpg">

The alt Attribute

The required alt attribute for the <img> tag specifies an alternate text for an image, if the image cannot be displayed:

The style Attribute

The style attribute is used to add styles to an element, such as color, font, size, and more:

The lang Attribute

You should always include the lang attribute inside the <html> tag, to declare the language of the Web page.

Example

html

<!DOCTYPE html>
<html lang="en">
<body>
  <!-- href attribute -->
  <a href="https://devforgeacademy.com" target="_blank">
    Visit DevForge Academy
  </a>

  <!-- src and alt attributes -->
  <img src="logo.png" alt="DevForge Academy Logo" width="200" height="100">

  <!-- style attribute -->
  <p style="color: #6C5CE7; font-size: 1.2rem;">
    Styled paragraph text
  </p>

  <!-- class and id attributes -->
  <div class="container" id="main-content">
    <p>Content with class and id</p>
  </div>
</body>
</html>

Try it yourself — HTML