Creating Definition Lists
A definition list is used to create a group of terms and definitions. It is also sometimes referred to as a description list, and although it is called a "list," it does not have bullets or numbers. Instead, it is similar to a table that doesn't have borders (although it can have borders, shading, etc. if you edit the necessary styles).
[Menu Proxy — Headings — Online — Depth3 ]
Definition List Tags and Styles
A definition list contains the following tags, which use corresponding styles to control their look.
- dl This refers to a definition list, which is the container holding the individual terms and definitions.
- dt This refers to a term in a definition list.
- dd This refers to a definition in a definition list.
Example You might create a definition list that initially looks like this:
Then you add these definition list styles to your stylesheet:
dl
{
width: 520px;
padding: 0;
border-bottom: solid 1px #000000;
}
dl dt,
dt
{
clear: left;
float: left;
width: 100px;
margin: 0;
padding: 5px;
border-top: solid 1px #000000;
font-weight: bold;
}
dl dd,
dd
{
margin: 0;
padding: 5px;
border-top: solid 1px #b9bec1;
margin-left: 100px;
}
dt + dd
{
border-top: solid 1px #000000;
}
As a result, the definition list (and others that you create in the project) will look like this instead:
Definition Lists and Context
By using definition list tags—as opposed to different markup, such as headings and regular paragraphs—you are providing context for the content. In other words, not only do end users recognize they are looking at a list of definitions and terms, but this kind of semantic markup allows meta data to be associated with it. Therefore, that information can more easily be extracted automatically.
Snippets and Definition Lists
One of the benefits of creating a definition list instead of using a table has to do with snippets. While creating snippets for parts of a table can be quite difficult, if not impossible, producing snippets from parts of a definition list is easy.
Example You have a table with three rows.
You want to create a snippet of the middle row so that you can insert it into other tables. When you right-click the tr structure bar, notice that there isn't even an option to create a snippet.
However, if you have the same content in a definition list…
… you can select the relevant content…
… and select Home > Create Snippet.
A snippet is created, which you can then insert in the midst of any other definition lists.
How to Create a Definition List
- Place your cursor in the XML Editor where you want to begin the list.
-
From the Home ribbon, click the down arrow in the list button , and select Definition List.
The structure bars to the left indicate that you have a <dl> (list) tag and a <dt> (term) tag within it.
-
Type the term and press ENTER.
Now you see another structure bar representing a <dd> (definition) tag.
-
Type the definition and press ENTER.
Another <dd> tag is created, in case you want to add another definition line for the term.
- Do one of the following:
- Add Another Definition Type the definition, then press ENTER.
- Add Another Term Press ENTER (which changes the line from a <dd> tag to a <dt> tag), then type the term.
- Exit Definition List Press ENTER twice (which places the cursor on a new <p> tag).
- Click to save your work.
If the animation below is cut off, you can see the complete animation by clicking the link under it to open the full topic.