AllInWorld99 provides a reference manual covering many aspects of web programming, including technologies such as HTML, XHTML, CSS, XML, JavaScript, PHP, ASP, SQL,FLASH, jQuery, java, for loop, switch case, if, if else, for...of, for...in, for...each,while loop, blogger tips, blogger meta tag generator, blogger tricks, blogger pagination, client side script, html code editor, javascript editor with instant output, css editor, online html editor, materialize css tutorial, materialize css dropdown list,break, continue statement, label,array, json, get day and month dropdown list using c# code, CSS button,protect cd or pendrive from virus, cordova, android example, html and css to make android app, html code play,telerik show hide column, Transparent image convertor, copy to clipboard using javascript without using any swf file, simple animation using css, SQL etc. AllInWorld99 presents thousands of code examples (accompanied with source code) which can be copied/downloaded independantly. By using the online editor provided,readers can edit the examples and execute the code experimentally.


HTML have three types of lists they are

  1. Ordered List
  2. Unordered List
  3. Description List

List in HTML

1.Ordered List

     The Ordered list is used to mark, this is defined inside the <ol> and <li> (List) tag. this will order the specific item list by using the defined list type.

Syntax of Ordered List


<ol>
 <li>List 1</li>
 <li>List 2</li>
 <li>List n</li>
</ol>

Type Attribute in Ordered List
     Type attribute is used to differentiate the style of the list, some styles are defined below

Numbers

<ol type="1">
 <li>List 1</li>
 <li>List 2</li>
 <li>List 3</li>
 <li>List 4</li>
</ol>


Output
  1. List 1
  2. List 2
  3. List 3
  4. List 4

Lower Case

<ol type="a">
 <li>List 1</li>
 <li>List 2</li>
 <li>List 3</li>
 <li>List 4</li>
</ol>

Output
  1. List 1
  2. List 2
  3. List 3
  4. List 4

Upper Case

<ol type="A">
 <li>List 1</li>
 <li>List 2</li>
 <li>List 3</li>
 <li>List 4</li>
</ol>

Output
  1. List 1
  2. List 2
  3. List 3
  4. List 4

Roman Lower Case

<ol type="i">
 <li>List 1</li>
 <li>List 2</li>
 <li>List 3</li>
 <li>List 4</li>
</ol>

Output
  1. List 1
  2. List 2
  3. List 3
  4. List 4

Roman Upper Case

<ol type="I">
 <li>List 1</li>
 <li>List 2</li>
 <li>List 3</li>
 <li>List 4</li>
</ol>

Output
  1. List 1
  2. List 2
  3. List 3
  4. List 4


2.Unordered List

     The Unordered list is used to mark, this is defined inside the <ul> and <li> (List) tag. this will not order the list instead of indicate the list using symbol like circle, disc etc..

Disc Type

<ul style="list-style-type:disc">
 <li>List 1</li>
 <li>List 2</li>
 <li>List 3</li>
 <li>List 4</li>
</ul>

Output
  • List 1
  • List 2
  • List 3
  • List 4

Circle Type

<ul style="list-style-type:Circle">
 <li>List 1</li>
 <li>List 2</li>
 <li>List 3</li>
 <li>List 4</li>
</ul>

Output
  • List 1
  • List 2
  • List 3
  • List 4

Square Type

<ul  style="list-style-type:square">
 <li>List 1</li>
 <li>List 2</li>
 <li>List 3</li>
 <li>List 4</li>
</ul>

Output
  • List 1
  • List 2
  • List 3
  • List 4

3.Description List

     Description list is written inside the <dl> , <dt> and <dd> tag.


<dl style="list-style-type:square">
 <dt>Main 1</dt>
 <dd>Sub 1</dd>
 <dt>Main 2</dt>
 <dd>Sub 2</dd>
 <dt>Main 3</dt>
 <dd>Sub 4</dd>
</dl>

Output
Main 1
Sub 1
Main 2
Sub 2
Main 3
Sub 4


Example Program:- (Editor)


Editor is Loading...

Advertisement

1 comment:

Total Pageviews