HTML Attributes

List of HTML Attributes. Includes lots of Background Information.

This entry is a list of attributes in HTML, as well as a few examples as of how to use them.

Global Attributes

Attributes are attached to the opening tag, starting with its name, followed by the equal sign (=) and finally its quoted value.

Attribute:	Description:
style	Used to apply styles.
title	Used for tool-tips.
class	Used to group elements, and by CSS selectors
id	Unique id_name.

The Style Attribute:

<p style="font-weight:bold;">A paragraph of text</p>

The style attribute is used to apply CSS styles

The title Attribute:

<p><a href="http://brugbart.com/References/html-attributes" title="Attributes in HTML">HTML Attributes</a></p>

The title attribute will be rendered as a small tooltip in most browsers, use it to apply a sub description to an element.

The class Attribute:

<!DOCTYPE html>
<html lang="en-US">

  <head>
    <title>Class attribute Example</title>
    <style type="text/css">
     .Yellow {
      color: blue;
     }
     .Gray {
      color: blue;
     }
    </style>
  </head>

  <body>
    <article>
      <h1>Class Attribute Example.</h1>
      <p class="Yellow">This paragraph is Yellow.</p>

      <p><a href="http://www.brugbart.com/" class="Yellow">Tutorials/References</a></p>
      <p><a href="http://validator.w3.org/" class="Gray">The W3C Markup Validation Service</a></p>
    </article>
  </body>

</html>

Brugbart Vision!

The class attribute is used to group elements, this makes it easy to style elements by the use of class selectors in css.

The id Attribute:

The id attribute is similar to the class attribute, elements with an id attribute may be styled by the use of id selectors any given id must not occur more then once in a page, if you need to group elements you should use classes instead, ids are used to apply a unique identifier to an element. Below is a heading with a unique ID

<h1>Example</h1>
<p>Section Linking Example</p>
<h2 id="Section2">Section2</h2>
<p>Second Section</p>

You can link to the second section by adding #Section2 to the url.

Event Attributes

The event attributes is used by scripts.

Attribute:	Value:	Description:
onclick	Script	A pointer button was clicked.
ondblclick	Script	A pointer button was double clicked
onmousedown	Script	A pointer button was pressed down
onmouseup	Script	A pointer button was released.
onmouseover	Script	A pointer was moved onto.
onmousemove	Script	A pointer was moved within.
onmouseout	Script	A pointer was moved away.
onkeypress	Script	A key was pressed and released.
onkeydown	Script	A key was pressed down.
onkeyup	Script	A key was released.
onload	Script	When either the page (use on body), image, or frame loads.

I18n Attributes

The Internationalization Attributes.

Attribute:	Value:	Description:
lang	LanguageCode	Language code
dir	ltr\|rtl	Direction for text.