HTML Tutorial
HTML - Introduction HTML - Basic HTML - Structure HTML - Element HTML - Attributes HTML - Headings HTML - Paragraphs HTML - Styles HTML - Formatting HTML - Phrase Tags HTML - Quotations HTML - Comments HTML - Colors HTML - CSS HTML - Links HTML - Images HTML - Tables HTML - List HTML - Inline elements HTML - Block elements HTML - Classes HTML - Id HTML - Javascript HTML - File Path HTML - Iframe HTML - Responsive HTML - Computer Code HTML - Head tag HTML - Events HTML - Url Encoding HTML - Entities HTML - Validation
HTML Forms
HTML - Forms HTML - Form Elements HTML - Input types HTML - Input Attributes
HTML5
HTML5 - Introduction HTML5 - New Elements HTML5 - Semantics HTML5 - Style Guide
HTML Media
HTML - Video HTML - Audio HTML - Embed Multimedia
HTML Graphics
HTML - Canvas HTML - SVG
HTML APIs
HTML - Geolocation HTML - Drag & drop HTML - Web Storage HTML - Web Workers
HTML References
HTML - Tag Reference HTML - Tag by Category HTML - Attributes HTML - Global Attributes HTML - Events HTML - Language Codes HTML - Country Codes HTML - URL Encoding HTTP Methods HTTP Status Codes <input> types

HTML Attributes

We have seen few HTML tags and their usage and we used them so far in their simplest form, but most of the HTML tags can also have attributes, which are extra bits of information.

  • Attributes provide additional information about HTML elements
  • An attribute is placed inside the element's opening tag
  • All attributes are made up of name & value pair like name="value"
Syntax
<element name="value">content goes here...</element>

All HTML elements can have attributes.


HTML href Attribute

HTML links are defined with the <a> tag. The link address is specified in the href attribute.

Run code

You will learn more about links later in this tutorial.



HTML src Attribute

HTML images are defined with the <img> tag. The filename of the image source is specified in the src attribute.

Run code

You will learn more about images later in this tutorial.


HTML alt Attribute

The alt attribute specifies an alternative text to be used, when an image cannot be displayed.

The easiest way to test your alt text is to purposely misspell your image name.

Run code

HTML style Attribute

The style attribute Specifies an inline CSS style for an element.

Run code

You can learn more about CSS in our CSS tutorial.


HTML lang Attribute

The language of the document can be declared in the <html> tag.

The language is declared with the lang attribute.

Declaring a language is important for screen readers and search engines.

Run code

"en" represents english.

For complete language code reference click here


HTML title Attribute

Whenever title attribute is added to an element. The value of the title attribute will be displayed as a tooltip when you mouse over the content of the element.

Run code

Double quotes around attribute values are the most common in HTML, but single quotes can also be used.

In some rare situations, when the attribute value itself contains quotes, it is necessary to wrap attribute value inside single quotes:

Or vice versa:


HTML Attributes

Below is an alphabetical list of some attributes often used in HTML:

Attribute Description
alt Specifies an alternative text in case an image can't be displayed
class Specifies a class name for an element
href Specifies the URL (Location) of a linked resource
height Specifies the height of the element
id Specifies a unique id for an element
lang Specifies the language of a document
src Specifies the URL of the embeddable content
style Specifies an inline CSS style for an element
title Specifies extra information about an element (Text to be displayed in a tooltip when hovering over the element)
width Specifies the width of the element

A complete list of all attributes for each HTML element, is listed in our: HTML Attribute Reference.