Ordered lists () in html hindi

Ordered lists (<ol>) in html hindi

एचटीएमएल वेब पेज में वेब टेक्स्ट को ऑर्डर्ड लिस्ट आइटम का उपयोग करके टेक्स्ट, इनफार्मेशन, वेब डिजिटल कंटेंट की लिस्ट आइटम को क्रिएट किया जाता है, जहाँ आप ऑर्डर्ड लिस्ट आइटम को डिफ़ॉल्ट सीक्वेंस आर्डर में डिस्प्ले करते है। एचटीएमएल वेब पेज में किसी पर्टिकुलर वेब पेज टेक्स्ट को <ol> टैग के माध्यम से सीक्वेंस आर्डर में डिफाइन किया जाता है, याद रहे की, एचटीएमएल वेब पेज में प्रत्येक ऑर्डर्ड लिस्ट आइटम को <li> टैग से लिस्ट में एक से अधिक बार क्रिएट किया जा सकता है।

Ordered lists () in html hindi

So let’s understand an ordered list item in HTML web pages better.

Basic Structure of an Ordered List in HTML Web Page.

<!DOCTYPE html>

<html lang=”en”>

<head>

    <meta charset=”UTF-8″>

    <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>

    <title>Html Ordered List Tag</title>

</head>

<body>

    <p><b>Ordered List Item Element</b></p>

    <ol>

        <li>Ordered Lits 1</li>

        <li>Ordered Lits 2</li>

        <li>Ordered Lits 3</li>

        <li>Ordered Lits 4</li>

        <li>Ordered Lits 5</li>

    </ol>

</body>

</html>

Customizing ordered lists in HTML web pages as per need.

आप अपनी वेब डेवलपमेंट जरूरतों के आधार पर मल्टीप्ल ऐट्रिब्यूट्स और सीएसएस स्टाइल प्रॉपर्टीज का उपयोग करके एचटीएमएल टेक्स्ट ऑर्डर्ड लिस्ट आइटम को मैन्युअली कस्टमाइज कर सकते हैं।

HTML Ordered List Type Attribute Features.

आपने अपनी विशेष वेब डेवलपमेंट जरूरतों के आधार पर एचटीएमएल वेब पेज टेक्स्ट को <ol> टैग की मल्टीप्ल डिफरेंट टाइप ol बुलेट ऐट्रिब्यूट्स फीचर्स का उपयोग लिस्ट आइटम में नंबर्स, स्माल और कैपिटल अल्फाबेट, रोमन नंबर, आदि ऑर्डर्ड लिस्ट आइटम के फ्रंट में डिस्प्ले कर सकते है।

Ordered List Type Attribute Features.

  • 1 – ऑर्डर्ड लिस्ट में डेसीमल/इन्टिजर नंबर।(डिफ़ॉल्ट प्रीव्यू).
  • A – अपरकेस लेटर ऑर्डर्ड लिस्ट आइटम प्रीव्यू।
  • A – लोअरकेस लेटर ऑर्डर्ड लिस्ट आइटम प्रीव्यू।
  • I – अपरकेस रोमन न्यूमेरिक ऑर्डर्ड लिस्ट आइटम प्रीव्यू।
  • i – लोअरकेस रोमन न्यूमेरिक ऑर्डर्ड लिस्ट आइटम प्रीव्यू।

Example use of multiple start attributes in an HTML web page.

<!DOCTYPE html>

<html lang=”en”>

<head>

    <meta charset=”UTF-8″>

    <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>

    <title>Html Ordered List Type Attribute Tag</title>

</head>

<body>

    <p><b>Number Ordered List Type</b></p>

    <ol type=”1″>

        <li>Integer First</li>

        <li>Integer Second</li>

        <li>Integer Third</li>

        <li>Integer Fourth</li>

    </ol>

    <p><b>Uppercase Alphabet Ordered List Type</b></p>

    <ol type=”A”>

        <li>Upper Case Alphabet A</li>

        <li>Upper Case Alphabet B</li>

        <li>Upper Case Alphabet C</li>

        <li>Upper Case Alphabet D</li>

    </ol>

    <p><b>Lowercase Alphabet Ordered List Type</b></p>

    <ol type=”a”>

        <li>Lower Case Alphabet a</li>

        <li>Lower Case Alphabet b</li>

        <li>Lower Case Alphabet c</li>

        <li>Lower Case Alphabet d</li>

    </ol>

    <p><b>Upper Case Roman Numeric Ordered List Type</b></p>

    <ol type=”I”>

        <li>Uppercase Roman Number 1</li>

        <li>Uppercase Roman Number 2</li>

        <li>Uppercase Roman Number 3</li>

        <li>Uppercase Roman Number 4</li>

    </ol>

    <p><b>Lower Case Roman Numeric Ordered List Type</b></p>

    <ol type=”i”>

        <li>Lowercase Roman Number 1</li>

        <li>Lowercase Roman Number 2</li>

        <li>Lowercase Roman Number 3</li>

        <li>Lowercase Roman Number 4</li>

    </ol>

</body>

</html>

ऑर्डर्ड लिस्ट टैग में टाइप ऐट्रिब्यूट्स एचटीएमएल वेब पेज पर्टिकुलर टेक्स्ट आइटम या इनफार्मेशन को ऑर्डर्ड लिस्ट प्रीव्यू मोड में टेक्स्ट, नंबर, रोमन न्यूमेरिक फॉर्मेट में मल्टीप्ल टेक्स्ट आइटम को डिस्प्ले चॉइस प्रदान करता है. आप इन ऑर्डर्ड लिस्ट्स आइटम को लिस्ट के स्टार्ट में शुरू करके इस्तेमाल कर सकते है।

html start attributes example.

<!DOCTYPE html>

<html lang=”en”>

<head>

    <meta charset=”UTF-8″>

    <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>

    <title>Html Ordered List Start Attribute Tag</title>

</head>

<body>

    <p><b>Start Ordered List Attributes</b></p>

    <ol start=”3″>

        <li>Ordered Item</li>

        <li>Ordered Item</li>

        <li>Ordered Item</li>

        <li>Ordered Item</li>

    </ol>

    <p><b>Start Ordered List Attributes</b></p>

    <ol start=”10″>

        <li>Ordered Item</li>

        <li>Ordered Item</li>

        <li>Ordered Item</li>

        <li>Ordered Item</li>

    </ol>

</body>

</html>

Applying HTML Web Page CSS Styling.

आप किसी भी एचटीएमएल वेब पेज में लिस्ट आइटम आर्डर प्रीव्यू करने ऑर्डर्ड लिस्ट आइटम डिफ़ॉल्ट लेआउट को रेस्पॉन्सिव बनाना और जरूरत के अनुसार लिस्ट आइटम ऐट्रिब्यूट्स में स्टाइलशीट इफ़ेक्ट को अप्लाई करना या मैनुअल रूप से कस्टमाइज कर सकते हैं।

ordered list item creation example with css.

<!DOCTYPE html>

<html lang=”en”>

<head>

    <meta charset=”UTF-8″>

    <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>

    <title>html ol list item customize with css</title>

    <style>

    p{

        color:blue;

        font-size:1.5em;

        font-family:monotype corsiva;

    }

        ol {

            margin: 10px;

            padding: 20px;

            list-style-type: upper-alpha; /* you can Change list start number style here */

        }

        ol li {

            font-family: Times New Roman;

            font-size: 15px;

            color: brown;

            margin-bottom: 20px; /* you can add Space between list items */

        }

    </style>

</head>

<body>

    <p><b>Customize Html Ol List With Css </b></p>

    <ol>

        <li>List Element First </li>

        <li>List Element Second </li>

        <li>List Element Third </li>

        <li>List Element Fourth </li>

    </ol>

</body>

</html>

HTML ordered list item information.

  • <ol> – ol टैग किसी भी एचटीएमएल वेब पेज में ऑर्डर्ड लिस्ट आइटम को क्रिएट करता है।
  • <li> – li टैग एचटीएमएल वेब पेज में <ol> टैग के अंदर प्रत्येक लिस्ट आइटम को li टैग से क्रिएट एक या अधिक बार लिखा किया जाता  है।
  • type – टाइप लिस्ट आइटम को एचटीएमएल वेब पेज में ऑर्डर्ड लिस्ट आइटम नंबरिंग स्टाइल को कस्टमाइज करता है।
  • start – स्टार्ट किसी भी लिस्ट आइटम में पहले एलिमेंट से शुरू हो कर एचटीएमएल वेब पेज में क्रिएट होने वाली लिस्ट आइटम  के लिए स्टार्ट लिस्ट एलिमेंट को डिफाइन करते है।
  • CSS – एचटीएमएल वेब पेज में सीएसएस लिस्ट न्यूमेरिक आर्डर, वेब पेज पेज मार्जिन और उपयोग होने वाले ऑर्डर्ड लिस्ट आइटम के फ़ॉन्ट स्टाइल्स सहित नंबर लिस्ट्स की डिफ़ॉल्ट अपीयरेंस को और अधिक मैन्युअल कस्टमाइज कर सकते है।