<ol> - HTML CSS HTML Tag

HTML CSS examples for HTML Tag:ol

Introduction

The ol element creates an ordered list.

The items in the list are marks by the li element

The ol Element summary

Item Value
Element ol
Local Attributes start, reversed, type
Contents Zero or more li elements
Tag Style Start and end tag
New in HTML5 No
Changes in HTML5 The reversed attribute is added in HTML5. The start and type attributes deprecated in HTML4 are restored in HTML5. The compact attribute is now obsolete.

Style Convention

ol {
   display: block;
   list-style-type: decimal;
   margin-before: 1em;
   margin-after: 1em;
   margin-start: 0;
   margin-end: 0;
   padding-start: 40px;
}

The following code shows the ol element being used to create a simple ordered list.

Demo Code

ResultView the demo in separate window

<!DOCTYPE html>
<html>
   <head> 
      <title>Example</title> 
   </head> 
   <body>
       I like: <!--  w  w  w. j a va2 s . c o m-->
      <ol> 
         <li>CSS</li> 
         <li>HTML</li> 
         <li>Code</li> 
         <li>Java</li> 
         <li>SQL</li> 
         <li>C</li> 
      </ol>  
   </body>
</html>

Related Tutorials