मैं एक आउटपुट इस के समान उत्पन्न करने के लिए देख रहा हूँ: निम्न HTML कोडक्षैतिज सूची (और आईई) आदेश दिया
<ol>
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
</ol>
ऐसा लगता है कि इंटरनेट एक्सप्लोरर नहीं चाहता है से
1. One 2. Two 3. Three 4. Four
जब आप क्षैतिज बनाने के लिए ली को फ़्लोट करते हैं तो संख्या (सूची-वस्तु) प्रदर्शित करें।
क्या कोई इसमें भाग लेता है और मुझे कोई समाधान मिला है जिसका उपयोग मैं कर सकता हूं?
इस कोड को सभी ब्राउज़रों कि मैं परीक्षण किया है में काम करता है। यदि आपको अभी तक कोई जवाब नहीं मिला है, तो सबसे लोकप्रिय उत्तर पर सुझाव मान्य है। अगर आप इसे लपेटना चाहते हैं तो बस अपनी चौड़ाई समायोजित करें।
<ol style="list-style-type:decimal; width: 600px;">
<li style="float: left; width: 200px; padding: 2px 0px;">Test</li>
<li style="float: left; width: 200px; padding: 2px 0px;">Test</li>
<li style="float: left; width: 200px; padding: 2px 0px;">Test</li>
</ol>
ol.horizontal{
list-style-type: decimal;
width: 600px;
}
ol.horizontal li{
float: left;
width: 200px;
padding: 2px 0px;
}
<ol class="horizontal">
<li>Test</li>
<li>Test</li>
<li>Test</li>
</ol>
सीएसएस:
li { display:inline; }
यह समाधान आईई, फ़ायरफ़ॉक्स, ओपेरा और सफारी के तत्वों से आदेशित सूची संख्याओं को छोड़ देता है। अपने प्रश्न से मैं मान रहा हूं कि वह उन्हें संरक्षित करना चाहता है। –
आप इस सीएसएस का उपयोग कर सकते हैं?
li {display: inline}
संपादित: इस आइटम नंबर की रक्षा नहीं करता है, और मैं किसी भी विधि है कि करता है के बारे में पता नहीं कर रहा हूँ। एक विकल्प के रूप में, मुझे लगता है कि जब तक आप सीएसएस काउंटर के लिए बेहतर समर्थन प्राप्त नहीं कर लेते हैं, तब तक आप मैन्युअल रूप से संख्याएं सम्मिलित कर सकते हैं।
यह समाधान आईई, फ़ायरफ़ॉक्स, ओपेरा और सफारी के तत्वों से आदेशित सूची संख्याओं को छोड़ देता है। अपने प्रश्न से मैं मान रहा हूं कि वह उन्हें संरक्षित करना चाहता है। –
अच्छा बिंदु ... मैं देखता हूं कि मुझे कुछ मिल सकता है और इसे संपादित कर सकता है। –
मैंने ली {प्रदर्शन: इनलाइन; सूची-शैली-प्रकार: दशमलव; } लेकिन सूचीबद्ध ब्राउज़रों में इसका कोई प्रभाव नहीं पड़ा। –
आप इनलाइन तत्वों पर चौड़ाई निर्धारित नहीं कर सकते हैं। तो मैं आम तौर पर उन्हें अस्थायी बजाय
li
{
float: left;
width:30px;
}
यह समाधान विंडोज 3.2.2 के लिए आईई 6, 7 और 8 आरसी 1, Google क्रोम और सफारी के तत्वों से आदेशित सूची संख्याओं को छोड़ देता है। यह फ़ायरफ़ॉक्स 2, 3 और 3.1 बी 2 में आदेशित सूची संख्याओं को संरक्षित करता है। अपने प्रश्न से मैं मान रहा हूं कि वह उन्हें संरक्षित करना चाहता है। –
अंत मैं this page पर हर display संपत्ति की कोशिश की है और जब IE में क्षैतिज सूची प्रदर्शित उनमें से कोई भी आदेश दिया सूची संख्या की रक्षा (और न ही वे फ़ायरफ़ॉक्स, ओपेरा में संरक्षित कर रहे हैं या विंडोज के लिए सफारी - और विस्तार से शायद Google क्रोम, हालांकि मैं मानता हूं कि मैंने वहां प्रत्येक display संपत्ति का परीक्षण नहीं किया था)।
एकमात्र समाधान (आंशिक रूप से - केवल फ़ायरफ़ॉक्स में) काम करता है Al W's answer है।
मुझे लगता है कि यदि आप एक क्षैतिज क्रमांकित सूची चाहते हैं, तो आपको इसे सर्वर पर उत्पन्न करना होगा या संख्याओं को फिर से सम्मिलित करने के लिए जावास्क्रिप्ट का उपयोग करके क्लाइंट पर सूची में हेरफेर करना होगा।
फ़ायरफ़ॉक्स का कौन सा संस्करण आपके लिए संख्या छुपाता है? मैं उन्हें एफएफ 3.0 में ठीक देखता हूं। चाहे वह एक बग है या नहीं, बहस योग्य है। –
@ बॉबी मैं जो कह रहा था वह है कि जब आप 'li {display: inline का उपयोग करते हैं तो आदेशित सूची संख्या संरक्षित नहीं होती है; } '। जब आप 'li {float: left; का उपयोग करते हैं तो वे फ़ायरफ़ॉक्स में संरक्षित होते हैं; चौड़ाई: 30px; } '(अल डब्ल्यू के जवाब के अनुसार)। –
मुझे this page about IE hasLayout उपयोगी मिला। इसमें ऐसी सूची स्वरूपण (पेज के सूचियों के लिए लिंक बिंदु)
ठीक है, आपको सीएसएस में एक फ्लोट, चौड़ाई और सूची-शैली-प्रकार विशेषता जोड़ने की आवश्यकता है। इस तरह दिखता है:
li{
float:left;
width:50px;
list-style-type:decimal;
}
Gushiken
मेरे लिए आई 7 में काम नहीं करता है। आप किस डॉक्टरेट का उपयोग कर रहे हैं? –
काम करता है। एक सुझाव के रूप में, आप फ्लोट को अन्य सामग्री के साथ गड़बड़ से रोकने के लिए सूची के अंत के बाद इस लाइन को जोड़ना चाह सकते हैं:
– Leeयह क्रोम 26 पर काम नहीं कर रहा है – matheusvmbruno