Students Empire

Learn Something New
Home

list




Unordered List


The ul element to denote unordered lists.


The items in the ul element are denoted using the li element.


The element doesn't define any attributes in HTML5 and you control the presentation of the list using CSS.


The type and compact attributes are obsolete in HTML5.


			      <!DOCTYPE HTML>
			    <html>
			    <body>
			    <ul>
			    <li>HTML</li>
			    <li>CSS</li>
			    <li>Javascript</li>
			    </ul>
			    </body>
			    </html>
			    

Each list item is displayed with a bullet. You can control which style bullet is used through the list-style-type CSS property.


			      <!DOCTYPE HTML>
			    <html>
			    <body>
			    <ul>
			    <li>HTML</li>
			    <li>CSS
			    <ul>
			    <li>Introdunction</li>
			    <li>CSS attributes</li>
			    </ul>
			    </li>
			    <li>Javascript</li>
			    </ul>
			    </body>
			    </html>
			    

Ordered List


The ol element denotes an ordered list. The items in the list are denoted using the li element.


The reversed attribute has been added in HTML5. The compact attribute is now obsolete in HTML5.


			        <!DOCTYPE HTML>
			    <html>
			    <body>
			    <ol>
			    <li>HTML</li>
			    <li>CSS</li>
			    <li>XML</li>
			    </ol>
			    </body>
			    </html>
			      

Attribute


You can control the items in the list using the attributes defined by the ol element.


The start attribute defines the ordinal value of the first item in the list. If this attribute is not defined, the first item is assigned the ordinal value of 1.


You use the type attribute to indicate which marker should be displayed next to each item.


Value Description Example
1 Decimal numbers (default) 1, 2, 3, 4
a Lowercase Latin characters a, b, c, d
A Uppercase Latin characters A, B. C. D
i Lowercase Roman characters i., ii., iii., iv.
I Uppercase Roman characters I., II., III., IV.

			      <html>
			    <body>
			    <ol>
			        <li>Item one</li>
			        <li>Item two</li>
			        <li>Item three</li>
			    <li>Item four
			      <ol>
			        <li>Item 4.1</li>
			        <li>Item 4.2</li>
			        <li>Item 4.3</li>
			        </ol>
			    </li>
			      <li>Item Five</li>
			    </ol>
			    </body>
			    </html>
			    

			      <html>
			    <body>
			    <ol type="A" start="4">
			      <li>Point number one</li>
			      <li>Point number two</li>
			      <li>Point number three</li>
			    </ol>
			    </body>
			    </html>
			  


Definition List


A description list consists of a set of term/description groupings.


You use three elements to define description lists: the dl , dt , and dd elements.


  • dl Denotes a description list.
  • dt Denotes a term within a description list.
  • dd Denotes a definition within a description list.

Multiple dd elements can be used for a single dt element, which allows you to provide multiple definitions for a single term.


			      <html>
			    <body>
			      <dl>
			        <dt>CSS</dt>
			          <dd>Cascading Style Sheets</dd>
			          <dd><i>a style sheet language used for describing the look and formatting of a document written in a markup language</i></dd>
			        <dt>HTML</dt>
			          <dd>The mark language</dd>
			        <dt>Javascript</dt>
			          <dd>The coding logic</dd>
			      </dl>
			    </body>
			    </html>