एक अनियंत्रित सूची के गोलियों को "दर्पण" कैसे करता है?

Question

इस प्रश्न को वाक्यांश देना मुश्किल था।

मुझे लगता है कि आप में से अधिकांश जानते हैं कि एक सामान्य अनियमित सूची में बाईं तरफ गोलियां हैं। मैं जानना चाहता हूं कि इन गोलियों को दाएं तरफ लेना संभव है (jquery समाधान ठीक हैं)।

विस्तार में थोड़ा जाने के लिए, मान लेते हैं कि: foo और bar:

1. 2 सूचियों मैं पक्ष-साथ प्रदर्शित करना चाहते हैं कर रहे हैं।
2. bar सूची का टेक्स्ट संरेखण सही होना चाहिए।
3. bar सूची की गोलियां विरोधी पक्ष पर होनी चाहिए।

पीएस चूंकि मुझे लगता है कि कोई कहेंगे, "क्यों? तार्किक के नाम पर क्यों आप ऐसी चीज करना चाहते हैं?" मेरा विनम्र लेकिन अजीब कोड-बंदर स्वयं को कबूल करना चाहिए कि यह "मानक" से थोड़ा ऊब गया है। ;)

संपादित करें:

dir='rtl' के उपयोग के रूप में यह मुझे के कारण अनचाहे प्रभाव में परिणाम केवल चाहने गोली उलट, नहीं वाक्य के रूप में अच्छी तरह से मेरे मामले के लिए काम नहीं करेगा।

Answer 1

आप dir='rtl' उपयोग नहीं कर सकते हैं, तो मुझे लगता है कि वहाँ कोई अच्छा समाधान वास्तव में है। आप डिफ़ॉल्ट सूची बुलेट को अक्षम करने के लिए सीएसएस का उपयोग कर सकते हैं और वर्कअराउंड के बजाए पृष्ठभूमि छवि को स्थिति में रख सकते हैं। वैकल्पिक रूप से, आप ऐसा कुछ कर सकते हैं:

<table> 
    <tr><td>First point. </td><td> <li> </li></td></tr> 
    <tr><td>Second point. </td><td> <li> </li></td></tr> 
</table> 

जो एक बुरा दिखने वाला कामकाज है, लेकिन जो भी आप चाहते हैं वह करता है। लेआउट के लिए टेबल्स स्पष्ट रूप से अवांछित है, लेकिन यहां मुझे लगता है कि स्थिति और परिवर्तनीय-ऊंचाई संरेखण के मामले में समतुल्य सीएसएस काफी जटिल होगा।

Answer 2

<ul dir='rtl'>...</ul> आज़माएं।

dir='rtf' स्निपेट ब्राउज़र को बताता है कि पाठ को दाएं से बाएं ("दिशा: दाएं से बाएं") पढ़ा जाना चाहिए।

संपादित करें: टिप्पणियां देखें! इसका उपयोग बाएं से दाएं भाषाओं के लिए नहीं किया जाना चाहिए!

Answer 3

यह दिशा विशेषता का उपयोग कर सीएसएस के साथ किया जा सकता है। बस direction:rtl करें।

पूरी तस्वीर:

<ul style="float:left"> 
    <li>Foo</li> 
    <li>Bar</li> 
</ul> 
<ul style="direction:rtl;float:right;"> 
    <li>Foo</li> 
    <li>Bar</li> 
</ul> 

http://startwithabreak.com/misc/test.html