HTML Elements, Tags, and Attributes

Saturday, February 4, 2012

Tags, Elements, and Attributes are not the same in HTML. In HTML, the term "tag" is typically used in a vague and generic fashion. Tags may sometimes be confused with other components of HTML. To clarify these items, lets discuss each in more detail.


Tags are used to denote the start or the end of an element. For instance, when defining a paragraph, you start with the opending tag, <p>. Next comes the content, which is your paragraph or information, and finally and end tag, </p>, so that your browser applies the correct formatting.


Elements are comprised of the start tag, the content, and the end tag. Some elements require no content or end tag. In this case there is only one tag used for the element. These types of elements are referred to as "Self closing tags", such as with the line break, <br />. Note how the line break tag has a forward slash after the "br" as opposed to the the slash before the "p" as in the previous example. This is because as previously mentioned it is both a start and an end tag combined into one. The forward slash in a "Self closing tag" can be omitted, but it is good practice to code your pages to meet the requirements of XHTML.


Attributes are used to add characteristics to an element. In the example of the image element, <img>, it has no content between an opening and closing tag, but it does have attributes. One important attribute for this element is "src", or source. This attribute tells the browser where to get the actual image file to display on the screen. Here is an example of an image element: <img src="" />.

The attributes listed below are standard attributes, and can be used in nearly all HTML/XHTML tags. The exceptions are <base>, <head>, <html>, <meta>, <param>, <script>, <style>, and <title>.

classSpecifies a classname for an element (stylesheet)
idSpecifies a unique id for an element
styleSpecifies an inline style for an element
titleSpecifies extra information about an element, displayed as a tool tip

The following attributes are also considered standard attributes by are not supported with the following elements: <base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param>, and <script>.

dirSpecifies the text direction for the content in an element
langSpecifies the language of the element's content
xml:langSpecifies the language of the element's content for XHTML documents

There are a variety of other required and optional attributes that can be used for specific elements. Those attributes are covered in the upcoming articles in this series.

Did you find the page informational and useful? Share it using one of your favorite social sites.

Recommended Books & Training Resources

HTML CSS: The Complete Reference Creating Web Pages Simplified HTML CSS and JavaScript Editor