Core Attributes

These tutorials are about XHTML, the Extensible Hypertext Markup Language.

Core Attributes

Core attributes are shared by most tags. The normally provide information about the tag or associate with code elsewhere in the document. The attributes are:

• style sheet related
  • style
  • class
• code related
  • name
  • id
• informational
  • title
  • lang

style and class

The style and class attributes are used to to associate elements in the code with style rules in order to format the content. We will discuss them in detail when we talk about style sheets. For now, let me just point out that the style attribute is used to apply style rules directly to an element, and the class attribute is used to associate the element with a specific category, or class, of element for styling purposes.

For instance, all important notices may be styled so that are in red text. You could apply a style rule to each such paragraph individually, or you could use a class that is associated with a style rule. The latter is very useful in that you only need to change the style rule in one place and it propagates through the entire document. Here is an example of both, although we won't explain them until we get to style sheets.

Using the style attribute:

<p style="color: red;">Important content!!!!!</p>

Using the class attribute:

<!-- style sheet defined in the header -->
<style>
.important { color: red; }
</style>
[ ... code skipped ... ]
<p class="important">Important content!!!!!</p>
<p class="important">More important content!!!!!</p>

name and id

The name and id attributes are used to assign names to elements so that they can be addressed by scripts and by code elsewhere in the document.

The name attribute is the old form and has been deprecated in favor of the id attribute. The name attribute should really only be used in forms now.

If you assign something a name or an ID, that name or ID must be unique to the document. This rule does not apply to names in forms, but it still does to IDs. We will discuss this elsewhere.

You can have a name and an ID that match each other. This is for backward compatability, by allowing you to include both. This is the recommended approach until the new standards are fully implemented.

Another thing name is still used for is anchor tags that allow points in the document to be named for reference in hyperlinks. In the new standards, this should be replaced by using ID attributes directly in the elements to be referenced.

Wrong: duplicate IDs:

<p id="para">Some content</p>
<p id="para">Some more content</p>

Wrong: duplicate names:

<p name="para">Some content</p>
<p name="para">Some more content</p>

Allowed, but a bad idea:

<p id="para">Some content</p>
<p name="para">Some more content</p>

An anchor tag that address backward compatability and new standards (we will discuss this under hyperlinks):

<p id="para"><a name="para">Some content</a></p>

If you want more than one element in a document associated with the same keyword, you can either use the class attribute, which defines a class of tag for style sheets, or by enclosing those elements in division. To use a division, all the elements to be associated with the division need to be grouped together for inclusion.

Using the class attribute:

<p class="para">Some content</p>
<p class="para">Some more content</p>

Using a division:

<div id="para">
<p>Some content</p>
<p>Some more content</p>
</div>

title

The title attribute is used to apply a title to the element. Depending on the browser you are using, the title may appear in the address bar when the mouse rolls over the element, or it may appear as a pop-up tool tip on the screen, or it may even appear on the title bar. It serves no other function but to assign a name to that element for the browser to show to the user by some means.

lang

The lang attribute is used to define the language being used in the element. Language refers to human languages, not computer languages. For instance, if the element is in English, then the attribute would be lang="en". Normally, you define a language for the entire document and then use the lang attribute elsewhere in the document to denote exceptions.

The purpose of the tag is so that alternative media understand that the content is not in the default language. For instance a text reader encountering a French word in the middle of an English text. The attribute is only useful for text content or audio content.

<html xml:lang="en" lang="en">
[ ... code skipped ... ]
<p>
The editor certainly made evident his 
<span lang="de">Weltanschauung</span>
in his response to that letter. 
</p>

When used in XHMTL documents it is recommended that anything declared with a lang attribute also be declared with an xml:lang attribute. One is the old form and the other the new form. This ensures that you have covered your bases.

These pages can be found at: [http://academ.hvcc.edu/~kantopet/]
Copyright 2003 -- Peter L. Kantor[kantopet@hvcc.edu]
Last Updated August 2003