दिलचस्प पोस्ट
क्या "ऑब्जेक्ट संदर्भ एक ऑब्जेक्ट के एक उदाहरण के लिए सेट नहीं" मतलब है? तालिका में तालिका पंक्ति और स्तंभ संख्या आईओएस 10 समर्थन के साथ Xcode 7.3.1 एएसपी.नेट में किसी वर्ग से सत्र चर का उपयोग कैसे करें? मैं grid.arrange का उपयोग कर एक मनमाना संख्या ggplots की व्यवस्था कैसे कर सकता हूँ? मैं कैसे एक «दोस्त» निर्भरता घोषणा ठीक से / refactor निकाल सकते हैं? एक परिवर्तन घटना पर एक UITextField के लिए मुद्रा स्वरूपण फिर से लागू करें ASP.NET WCF को "कुंजी" और "मान" टैग को छोड़कर, JSON को कन्वर्ट करें नई स्व बनाम नई स्थिर स्विंग जीयूआई का सबसे अच्छा स्थान कैसे? .NET LINQ क्वेरी सिंटैक्स बनाम विधि श्रृंखला एंड्रॉइड – इयरपीस के माध्यम से खेलने के लिए ऑडियो प्राप्त करना एएसपी एमवीसी आईआईएस 7 में परिणाम: HTTP त्रुटि 403.14 – निषिद्ध वायरलेस नेटवर्क के SSID को प्राप्त करें मैं सी # के साथ कनेक्ट हूँ। Windows Vista पर राइनो.मॉक्स का प्रयोग करके स्थैतिक तरीकों का मजाक उड़ा रहा है

संख्या ने एचटीएमएल में नेस्टेड आदेश सूची

मेरे पास नेस्टेड आदेश सूची है I

<ol> <li>first</li> <li>second <ol> <li>second nested first element</li> <li>second nested secondelement</li> <li>second nested thirdelement</li> </ol> </li> <li>third</li> <li>fourth</li> </ol> 

वर्तमान में नेस्टेड तत्व 1 से फिर से शुरू करते हैं, उदा

  1. प्रथम
  2. दूसरा
    1. दूसरा नेस्टेड पहला तत्व
    2. दूसरा नेस्टेड दूसरा तत्व
    3. दूसरा नेस्टेड तीसरा तत्व
  3. तीसरा
  4. चौथा

मैं क्या चाहता हूँ दूसरा तत्व इस तरह गिने जा रहा है:

  1. प्रथम
  2. दूसरा

    2.1। दूसरा नेस्टेड पहला तत्व

    2.2। दूसरा नेस्टेड दूसरा तत्व

    2.3। दूसरा नेस्टेड तीसरा तत्व

  3. तीसरा
  4. चौथा

क्या इसे करने का कोई तरीका है?

वेब के समाधान से एकत्रित समाधान "संख्या ने एचटीएमएल में नेस्टेड आदेश सूची"

यह एक उदाहरण है जो सभी ब्राउज़रों में काम करता है शुद्ध सीएसएस दृष्टिकोण असली ब्राउज़रों में काम करता है (अर्थात आईआई 6/7 सब कुछ है) और jQuery कोड असमर्थित को कवर करना है। यह एक एसएससीसीई के स्वाद में है, आप इसे बिना किसी बदलाव के कॉपी''अनुरोध कर सकते हैं।

 <!doctype html> <html lang="en"> <head> <title>SO question 2729927</title> <script src="http://code.jquery.com/jquery-latest.min.js"></script> <script> $(document).ready(function() { if ($('ol:first').css('list-style-type') != 'none') { /* For IE6/7 only. */ $('ol ol').each(function(i, ol) { ol = $(ol); var level1 = ol.closest('li').index() + 1; ol.children('li').each(function(i, li) { li = $(li); var level2 = level1 + '.' + (li.index() + 1); li.prepend('<span>' + level2 + '</span>'); }); }); } }); </script> <style> html>/**/body ol { /* Won't be interpreted by IE6/7. */ list-style-type: none; counter-reset: level1; } ol li:before { content: counter(level1) ". "; counter-increment: level1; } ol li ol { list-style-type: none; counter-reset: level2; } ol li ol li:before { content: counter(level1) "." counter(level2) " "; counter-increment: level2; } ol li span { /* For IE6/7. */ margin: 0 5px 0 -25px; } </style> </head> <body> <ol> <li>first</li> <li>second <ol> <li>second nested first element</li> <li>second nested second element</li> <li>second nested third element</li> </ol> </li> <li>third</li> <li>fourth</li> </ol> </body> </html> 

मुझे पता है कि उत्तर देने में देर हो गई है, लेकिन मुझे बस सीएसएस का उपयोग करने का एक उदाहरण मिला। इसे आप सीएसएस अनुभाग (या फ़ाइल) में जोड़ें:

 ol.nested { counter-reset: item } li.nested { display: block } li.nested:before { content: counters(item, ".") ". "; counter-increment: item } 

यहां एक उदाहरण है कि आपकी सूची कोड कैसा दिखेगा:

 <ol class="nested"> <li class="nested">item 1</li> <li class="nested">item 2 <ol class="nested"> <li class="nested">subitem 1</li> <li class="nested">subitem 2</li> </ol></li> <li class="nested">item 3</li> </ol> 

HTH

इस पृष्ठ पर कोई भी समाधान सभी स्तरों और लंबे (लपेटा हुआ) पैराग्राफ के लिए सही और वैश्विक रूप से काम करता है। मार्कर के चर आकार (1., 1.2, 1.10, 1.10.5, …) के कारण लगातार इंडेंटेन्ट हासिल करने के लिए वाकई मुश्किल है; यह सिर्फ "बेक किया हुआ" नहीं हो सकता है, यहां तक ​​कि प्रत्येक संभव इंडेंटेशन स्तर के लिए प्रीकम्पुटेड मार्जिन / पैडिंग के साथ भी नहीं।

मैं अंत में एक समाधान का पता लगाया जो वास्तव में काम करता है और किसी भी जावास्क्रिप्ट की आवश्यकता नहीं है।

यह फ़ायरफ़ॉक्स 32, क्रोमियम 37, आईई 9 और एंड्रॉइड ब्राउज़र पर परीक्षण किया गया है। IE 7 और पिछले पर काम नहीं करता है

सीएसएस:

 ol { list-style-type: none; counter-reset: item; margin: 0; padding: 0; } ol > li { display: table; counter-increment: item; margin-bottom: 0.6em; } ol > li:before { content: counters(item, ".") ". "; display: table-cell; padding-right: 0.6em; } li ol > li { margin: 0; } li ol > li:before { content: counters(item, ".") " "; } 

उदाहरण: उदाहरण

इसे jsFiddle पर कोशिश करो, यह Gist पर कांटा।

अगर आप स्टाइल के लिए प्रोजेक्ट में sass / scss इस्तेमाल करते हैं तो आप इस के लिए मिक्सिन का इस्तेमाल कर सकते हैं। इस नेस्टेड सूची को स्टाइल करने के लिए आपको केवल दो पंक्तियां सॉस कोड की आवश्यकता होती है

 @import 'nested_list' +nested_list('nested', 2) <ol> <li>first</li> <li>second <ol class="nested-2"> <li>second nested first element</li> <li>second nested secondelement</li> <li>second nested thirdelement</li> </ol> </li> <li>third</li> <li>fourth</li> </ol> 

पूर्ण उदाहरण आप जीआईटी रेपो से तैयार / देख सकते हैं या सीधा सीएसएस पर जा सकते हैं

थोड़ा सा tweaking के साथ, आप अनुक्रमिक सूची बनाने के लिए यहां इस्तेमाल की गई तकनीक (दूसरे उदाहरण में) को अनुकूलित करने में सक्षम होना चाहिए।

यह शुद्ध HTML / CSS में संभव नहीं है बॉलुस के एक महान विचार-के-द-बॉक्स समाधान के लिए जवाब देखें। नंबरों की एक सूची w3schools पर यहां पाई जा सकती है

सबसे निकटतम विकल्प मैं ढूंढने में सक्षम था w3c से, value विशेषता का उपयोग , लेकिन निम्न मार्कअप

 <ol> <li value="30"> makes this list item number 30. </li> <li value="40"> makes this list item number 40. </li> <li> makes this list item number 41. </li> <li value="2.1"> makes this list item number ... </li> <li value="2-1"> makes this list item number ... </li> </ol> 

30, 40, 41, 2 और 2 की संख्या सूचीबद्ध करता है।

जैसा कि जॉन ने पहले ही बताया है, आपकी स्थिति में, आपकी सबसे अच्छी शर्त पटकथा होने जा रही है