UL (thing)

ul is an HTML tag that is used to create an unordered list. This tag is useful for creating bulleted lists and other structured list types. Since HTML should be used to structure a document rather than add stylistic elements, the ul tag should not simply be used to indent text.

See also: dd, dir, dl, dt, li, menu, ol

Attributes

The ul tag does not have any required HTML attributes. It does, however have numerous allowable attributes. Some of the most commonly used attributes are now deprecated in favor of Cascading Style Sheets.

• Deprecated Attributes
  • compact (type: Custom) - specifies that the list should be displayed in a compact manner; it is up to the user agent to determine what this means and how to do it
  • type (type: ULStyle) - determines which ordering style to use ("disc" is usually a filled in circle, "circle" is usually an open circle, and "square" is a filled in square)
     
• HTML Core Attributes
  • class (type: CDATA) - space separated list of classes
  • id (type: ID) - document-wide unique id
  • style (type: Style Sheet) - associated style information
  • title (type: Text) - advisory title/amplification; this information is usually displayed through tooltips
     
• HTML International Attributes (I18N)
  • dir (type: Custom) - specifies the direction of weak or neutral text; valid values include ltr (left to right) or rtl (right to left)
  • lang (type: Custom) - specifies the Language Code of the language used in the text
     
• HTML Event Attributes
  • onclick (type: Script) - a pointer button was clicked
  • ondblclick (type: Script) - a pointer button was double clicked
  • onkeydown (type: Script) - a key was pressed down
  • onkeypress (type: Script) - a key was pressed and released
  • onkeyup (type: Script) - a key was released
  • onmousedown (type: Script) - a pointer button was pressed down
  • onmousemove (type: Script) - a pointer was moved within
  • onmouseout (type: Script) - a pointer was moved away
  • onmouseover (type: Script) - a pointer was moved onto
  • onmouseup (type: Script) - a pointer button was released

Usage

In its simplest form, to use the ul tag simply place opening and closing HTML tags around a series of list items (which use the li tag). However, it can be a little tricky when dealing with nested lists. If you have lists inside of lists, be sure that you enclose each nested list entirely within an li tag. For example:

<ul>
  <li>Top Level A</li>
  <li>Top Level B
    <ul>
      <li>Nested Level 1A</li>
      <li>Nested Level 1B
        <ul>
          <li>Nested Level 2A</li>
          <li>Nested Level 2B</li>
          <li>Nested Level 2C</li>
        </ul>
      </li>
      <li>Nested Level 1C</li>
    </ul>
  <li>Top Level C</li>
</ul>

See also: this and this.

Everything2 Support?

E2 does provide limited support for the ul tag, but it does not allow the use of any of its HTML attributes. Below is how your browser displays the example above here on Everything2:

• Top Level A
• Top Level B
  • Nested Level 1A
  • Nested Level 1B
    • Nested Level 2A
    • Nested Level 2B
    • Nested Level 2C
  • Nested Level 1C
• Top Level C

Notice that even though the "type" attribute is not used, the nested lists use a different bullet style than used in the levels above. If you would like to use this tag with any of its attributes or with style sheets, you can do so in your Notelet Nodelet.

Common Browser Implementations*

Most web browsers support this tag, as it has been around since HTML 2.0. Most browsers will display the unordered lists in the same general manner though you may see minor differences between platforms, operating systems, and browsers.

Previous HTML Tag: u
Next HTML Tag: var
See Also: HTML tags and HTML attributes

* Please feel free to send me information about how other browsers implement this tag.