PROVIDING ACCURATE, RELIABLE AND STRAIGHT TO THE POINT KNOWLEDGE ABOUT DIFFERENT IT TOOLS EXPLAINED WITH PRACTICAL EXAMPLES
HTML-LISTS-ordered list
If we go by the definition of a LIST, its a set of the items which belong to the same group or class.
Same is the case with the LISTS in HTML.
If you remember the history of the HTML, it was developed for Research AND Educational work, so LISTS AND TABLES were part of HTML from very beginning.
HTML-GENERAL FORMAT OF LIST ELEMENT
The LIST TAG is used to tell the browser that the following text is to be represented as LISTS. Although there are three types of lists present, the format for this element is almost similar to all the three types. Here is the format.
<TAG OF TYPE OF LIST>
<LI> ITEM DESCRIPTION </LI>
.
.
.
.
</TAG OF TYPE OF LIST>
This is the standard format of using any list.
HTML-TYPES OF LISTS
There are mainly THREE TYPES OF LISTS in HTML.
- ORDERED LIST
- UNORDERED LIST
- DEFINITION LIST
html-what is ordered list?
As the name itself is self explanatory, it is ordered one. We put numbers in ascending order to make anything in order, so does the ordered list in html. So THE ORDERED LIST IS THE ONE WHICH-
- is preceded by a number, a roman numeral or an alphabet to show that the list is in order. The numerals or alphabet can be in upper case or lower case.
html-ordered list example
Let us make an ordered list.
STEPS:
- Open the NOTEPAD.
- COPY OR TYPE the following code for the ordered list.
- The explanation follows after the pictorial description.
SCENARIO: Let us make a list of steps to switch on the tv.
To accomplish this target, we have to do the following steps.
STEPS:
- Plug in the TV.
- Take out the remote.
- Press standby button on remote and the tv will turn on.
<!doctype html5>
<html>
<head>
<title>Example Ordered List</title>
</head>
<body>
<ol>
<li>
Plug in the TV.
</li>
<li>
Take out the remote.
</li>
<li>
Press standby button on remote and the tv will turn on.
</li>
</ol>
</body>
</html>
HTML-ATTRIBUTES-CHOOSING TYPE OF NUMBERING IN LIST
As already mentioned, there are different ways of using the numbers in the ORDERED LIST.
For example numerals, alphabet, lower or upper case, roman etc.
In the following code , take a look at the attribute setting in the <OL> tag.(ordered list tag)
THE ATTRIBUTE TO SET ORDERED LIST TYPE
HTML:example of SETTING THE NUMBERING TYPE IN ORDERED LIST
HTML:example code-ready to be copied
<!doctype html5>
<html>
<head>
<title>GYANKOSH.NET ORDERED LIST ATTRIBUTES</title>
</head>
<body><CODE>
<ol style=”list-style:lower-greek;”>
<li>
Plug in the TV.
</li>
<li>
Take out the remote.
</li>
<li>
Press standby button on remote and the tv will turn on.
</li>
</ol>
<br>
<br>
<ol style=”list-style:lower-roman;”>
<li>
Plug in the TV.
</li>
<li>
Take out the remote.
</li>
<li>
Press standby button on remote and the tv will turn on.
</li>
</ol>
</CODE>
</body>
Numeric: decimal, decimal-leading-zero, arabic-indic, armenian, upper-armenian, lower-armenian, bengali, cambodian, khmer, cjk-decimal, devanagari, georgian, gujarati, gurmukhi, hebrew, kannada, lao, malayalam, mongolian, myanmar, oriya, persian, lower-roman, upper-roman, tamil, telugu, thai, tibetan
Alphabetic: lower-alpha, lower-latin, upper-alpha, upper-latin, lower-greek, hiragana, hiragana-iroha, katakana, katakana-iroha
Symbolic: disc, circle, square, disclosure-open, disclosure-closed
HTML:NUMBERING INSIDE OR OUTSIDE THE MARGIN
This function allows us to keep the number within the list or want to keep the numbering outside the list. Following is the example for the same.
THE TAG FOR SETTING THE INSIDE POSITION OR OUTSIDE POSITION IS:
THE ATTRIBUTE TO SET ORDERED LIST POSITION
HTML:example for NUMBERING INSIDE OR OUTSIDE THE MARGIN
HTML:example code-ready to be copied
<!doctype html5>
<html>
<head>
<title>GYANKOSH.NET ORDERED LIST ATTRIBUTES</title>
</head>
<body><CODE>
<ol style=”list-style:lower-greek;list-style-position:inside;”>
<li>
Plug in the TV.
</li>
<li>
Take out the remote.
</li>
<li>
Press standby button on remote and the tv will turn on.
</li>
</ol>
<br>
<br>
<ol style=”list-style:lower-roman;”>
<li>
Plug in the TV.
</li>
<li>
Take out the remote.
</li>
<li>
Press standby button on remote and the tv will turn on.
</li>
</ol>
</body>
</html>
HTML:SETTING A CUSTOM STARTING VALUE FOR ORDERED LIST
Sometimes a situation may occur when we need to start the ORDERING FROM A SPECIFIC NUMBER. In that case we need to give our counter a starting value.
Here is the TAG for reference.
THE ATTRIBUTE TO SET A CUSTOM START
HTML:example for SETTING A CUSTOM STARTING VALUE FOR ORDERED LIST
example code-ready to be copied
<html>
<head>
<title>GYANKOSH.NET ORDERED LIST ATTRIBUTES</title>
</head>
<body><CODE>
<ol start=”3″>
<li>
Plug in the TV.
</li>
<li>
Take out the remote.
</li>
<li>
Press standby button on remote and the tv will turn on.
</li>
</ol>
<br>
<br>
<ol style=”list-style:lower-roman;”>
<li>
Plug in the TV.
</li>
<li>
Take out the remote.
</li>
<li>
Press standby button on remote and the tv will turn on.
</li>
</ol>
</body>
</html>
OTHER WAYS TO REACH THIS ARTICLE
WHAT IS EXCEL, HOW EXCEL WORKS, WRITE FORMULA IN EXCEL, EXAMPLE OF USING FORMULA IN EXCEL, ANIMATED EXAMLPE OF USING FORMULA IN EXCEL
YOU MAY LIKE
- HOW TO TROUBLESHOOT A FORMULA IN EXCEL?
- USE OF FONTS, FONT SIZE, INDENTATION, TEXT TO THE RIGHT, TEXT TO THE LEFT, TEXT IN THE MIDDLE ETC.
- how to insert table in excel?
- FOR MORE ARTICLES, CLICK EXCEL OR TYPE IN SEARCH BELOW.
LEARN
- EXCEL
- HTML
- JAVASCRIPT
- MORE TO COME…
If you have any queries or suggestions or any problem which you would like us to solve for you, kindly mail at