HTML dl tag
Note: If you don't know what a tag is and/or how you must use it we recommend you to read our HTML tags and attributes tutorial that you can find in our HTML tutorials section.
The
HTML dl tag defines a list. A list is composed by terms (
HTML dt tag) and descriptions (
HTML dd tag). The order and structure of a list is left to the author consideration. The most common type of list is structured by a sequence of terms and descriptions, where each description is visually associated to a term.
The "id" attribute assigns an identifier to the associated element. This identifier must be unique in the document and can be used to refer to that element.
Example:
Code begin
<p id="paragraph1">This is the first paragraph named as paragraph1. To dynamically change its properties use this identifier.</p>
Code end
The "class" attribute assigns a class name (or a list of class names separated by spaces) to the container element. It's used with style sheets and tells the browser the class to which the element is associated with. A class gives visual attributes to elements.
Example:
Code begin
<p class="references">This article is based on the book "Wind in the trees" by Jhon L. Brooks</p>
<p class="references important">This article is based on the book "Wind in the trees" by Jhon L. Brooks... and is more important than the one before.</p>
Code end
Defines a visual style of this element. Is a better practice to define styles attributes in external style sheets grouping them in classes. Attributes in the "style" parameter must preserve this order "name : value" and be separated by a semi-colon.
If you're writing
XHTML code it's recommended not to use this attribute and try style sheet classes (with the "class" attribute).
Example:
Code begin
<p style="color: #0000FF; font-size: 12pt">This is a paragraph with a defined style</p>
<p>And this is another text without style.</p>
Code end
Indicates a title for the element. Used to give a short description about the element that is usually shown as a "tool tip" when the user put the mouse pointer over the element.
Example:
|
Code
|
View
|
|
<a title="HTMLQuick.com" href="http://www.htmlquick.com">HTML code</a>
|
HTML code
|
Specifies the language of an element's content. The default value in "unknown".
When writing
XHTML code the syntax "xml:lang" represents a preferred alternative in XHTML 1.0 and a replacement in XHTML 1.1 (e.g., xml:lang="en").
Example:
Code begin
<p lang="en">This is a paragraph in english.</p>
<p lang="es">Este es un párrafo en español.</p>
Code end
dir
Specifies the text direction of the element's contents and attribute values, as well as tables directionality. It has two possible values that are case insensitive:
- RTL: Right to left.
- LTR: Left to right.
Example:
Code begin
<q lang="he" dir="rtl">...a Hebrew quotation...</q>Code end
- onclick
- ondblclick
- onmousedown
- onmouseup
- onmouseover
- onmousemove
- onmouseout
- onkeypress
- onkeydown
- onkeyup
See complete list and information about
events in HTML
A basic list.
|
Code
|
View
|
List of available colors:
<dl>
<dt>Red</dt>
<dd>Costructed by <em>R:255</em> ; G:0 ; B:0</dd>
<dt>Green</dt>
<dd>Costructed by R:0 ; <em>G:255</em> ; B:0</dd>
<dt>Blue</dt>
<dd>Costructed by R:0 ; G:0 ; <em>B:255</em></dd>
<dt>Black</dt>
<dd>Costructed by R:0 ; G:0 ; B:0</dd>
<dt>White</dt>
<dd>Costructed by R:255 ; G:255 ; B:255</dd>
</dl>
|
List of available colors:
- Red
- Costructed by R:255 ; G:0 ; B:0
- Green
- Costructed by R:0 ; G:255 ; B:0
- Blue
- Costructed by R:0 ; G:0 ; B:255
- Black
- Costructed by R:0 ; G:0 ; B:0
- White
- Costructed by R:255 ; G:255 ; B:255
|
All terms listed first.
|
Code
|
View
|
Terms used in HTML documents:
<dl>
<dt>HTML</dt>
<dt>CSS</dt>
<dt>JS</dt>
<dd>Hyper Text Markup Language</dd>
<dd>Cascade Style Sheet</dd>
<dd>JavaScript</dd>
</dl>
|
Terms used in HTML documents:
- HTML
- CSS
- JS
- Hyper Text Markup Language
- Cascade Style Sheet
- JavaScript
|
