एचटीएमएल <ol> टैग
उदाहरण
दो अलग-अलग क्रमित सूचियाँ (पहली सूची 1 से शुरू होती है और दूसरी 50 से शुरू होती है):
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ol start="50">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
नीचे और अधिक "इसे स्वयं आज़माएं" उदाहरण।
परिभाषा और उपयोग
<ol>टैग एक आदेशित सूची को परिभाषित करता है । एक आदेशित सूची संख्यात्मक या वर्णानुक्रम में हो सकती है।
प्रत्येक सूची आइटम को परिभाषित करने के लिए <li> टैग का उपयोग किया जाता है ।
युक्ति: सूची को स्टाइल करने के लिए CSS का उपयोग करें ।
युक्ति: अनियंत्रित सूची के लिए, <ul> टैग का उपयोग करें।
ब्राउज़र समर्थन
| Element | |||||
|---|---|---|---|---|---|
| <ol> | Yes | Yes | Yes | Yes | Yes |
गुण
| Attribute | Value | Description |
|---|---|---|
| reversed | reversed | Specifies that the list order should be reversed (9,8,7...) |
| start | number | Specifies the start value of an ordered list |
| type | 1 A a I i |
Specifies the kind of marker to use in the list |
वैश्विक गुण
<ol>टैग HTML में वैश्विक विशेषताओं का भी समर्थन करता है ।
घटना गुण
<ol>टैग HTML में ईवेंट विशेषताओं का भी समर्थन करता है ।
और ज्यादा उदाहरण
उदाहरण
विभिन्न सूची प्रकार सेट करें (सीएसएस के साथ):
<ol style="list-style-type:upper-roman">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ol style="list-style-type:lower-alpha">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
उदाहरण
CSS के साथ उपलब्ध सभी विभिन्न सूची प्रकार प्रदर्शित करें:
<style>
ol.a {list-style-type: armenian;}
ol.b {list-style-type: cjk-ideographic;}
ol.c {list-style-type: decimal;}
ol.d {list-style-type:
decimal-leading-zero;}
ol.e {list-style-type: georgian;}
ol.f
{list-style-type: hebrew;}
ol.g {list-style-type: hiragana;}
ol.h
{list-style-type: hiragana-iroha;}
ol.i {list-style-type: katakana;}
ol.j {list-style-type: katakana-iroha;}
ol.k {list-style-type:
lower-alpha;}
ol.l {list-style-type: lower-greek;}
ol.m
{list-style-type: lower-latin;}
ol.n {list-style-type: lower-roman;}
ol.o {list-style-type: upper-alpha;}
ol.p {list-style-type: upper-latin;}
ol.q {list-style-type: upper-roman;}
ol.r {list-style-type: none;}
ol.s {list-style-type: inherit;}
</style>
उदाहरण
सूचियों में लाइन-ऊंचाई कम करें और विस्तृत करें (सीएसएस के साथ):
<ol style="line-height:80%">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
<ol
style="line-height:180%">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
उदाहरण
एक ऑर्डर की गई सूची के अंदर एक अनियंत्रित सूची को नेस्ट करें:
<ol>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea</li>
</ul>
</li>
<li>Milk</li>
</ol>
संबंधित पृष्ठ
HTML ट्यूटोरियल: HTML सूचियाँ
एचटीएमएल डोम संदर्भ: ओएल ऑब्जेक्ट
सीएसएस ट्यूटोरियल: स्टाइलिंग सूचियाँ
डिफ़ॉल्ट सीएसएस सेटिंग्स
अधिकांश ब्राउज़र <ol>निम्न डिफ़ॉल्ट मानों के साथ तत्व प्रदर्शित करेंगे:
उदाहरण
ol {
display: block;
list-style-type: decimal;
margin-top: 1em;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
padding-left: 40px;
}