2012-08-24 23 views
96

सभी डिफ़ॉल्ट इनपुट के लिए, आपके द्वारा भरने वाला पाठ बाईं ओर शुरू होता है। आप इसे सही तरीके से कैसे शुरू करते हैं?किसी इनपुट के अंदर ग्रंथों को संरेखित कैसे करें?

+2

यह क्षेत्रों से बदल रहा है एक सही-से-बाएँ भाषा के साथ संगत होना करने के लिए? –

उत्तर

163

अपने सीएसएस में text-align संपत्ति का उपयोग करें:

input { 
    text-align: right; 
} 

इस पृष्ठ के सभी आदानों से प्रभावी हो जाएंगी।

<input type="text" style="text-align:right;"/> 
13

अपने सीएसएस में इस प्रयास करें:
अन्यथा, यदि आप सिर्फ एक इनपुट के पाठ संरेखित करना चाहते हैं, शैली इनलाइन सेट

input { 
text-align: right; 
} 

केंद्र में पाठ संरेखित करने के लिए:

input { 
text-align: center; 
} 

लेकिन, यह बाईं ओर संरेखित किया जाना चाहिए, के रूप में है कि डिफ़ॉल्ट है - और सबसे उपयोगकर्ता के अनुकूल प्रतीत होता है। पाठ इनपुट

शैली = की शैली संपत्ति का उपयोग करें:

-3
सीएसएस बिना

"text-align: ठीक है,"

+8

यह अभी भी सीएसएस है, बस इनलाइन सीएसएस। –

+1

स्टाइल विशेषता का उपयोग इनलाइन सीएसएस बनाने के लिए किया जाता है। कोड 'टेक्स्ट-एलाइन: दाएं' निश्चित रूप से सीएसएस है। –

+1

इसके अलावा, कृपया कैप्स में कोड न करें; ( – elli0t

4

स्वीकार किए जाते हैं जवाब यहाँ सही है, लेकिन मैं एक छोटे से जानकारी जोड़ना चाहते हैं। यदि आप बूटस्ट्रैप जैसे पुस्तकालय/ढांचे का उपयोग कर रहे हैं तो इसके लिए कक्षाओं में बनाया जा सकता है। उदाहरण के लिए बूटस्ट्रैप text-right वर्ग का उपयोग करता है। इस तरह यह प्रयोग करें:

<input type="text" class="text-right"/> 
<input type="number" class="text-right"/> 

एक नोट इस रूप में अच्छी तरह अन्य इनपुट प्रकार पर काम करता है, आंकिक की तरह के रूप में ऊपर दिखाया गया है।

आप बूटस्ट्रैप की तरह एक अच्छा ढांचा उपयोग नहीं कर रहे हैं तो आप इस सहायक वर्ग के अपने स्वयं के संस्करण बना सकते हैं। अन्य उत्तरों के समान, लेकिन हम इसे सीधे इनपुट कक्षा में नहीं जोड़ेंगे, इसलिए यह आपकी साइट या पेज पर प्रत्येक इनपुट पर लागू नहीं होगा, यह वांछित व्यवहार नहीं हो सकता है। तो यह इनलाइन स्टाइल की आवश्यकता के बिना या प्रत्येक इनपुट बॉक्स को प्रभावित किए बिना चीजों को संरेखित करने के लिए एक अच्छा आसान सीएसएस वर्ग बनाएगा।

.text-right{ 
    text-align: right; 
} 

अब आप इस वर्ग class="text-right" साथ ऊपर इनपुट के रूप में बिल्कुल वैसा ही उपयोग कर सकते हैं। मुझे पता है कि यह कई महत्वपूर्ण स्ट्रोक को सहेज नहीं रहा है लेकिन यह आपके कोड क्लीनर बनाता है।

 संबंधित मुद्दे

  • कोई संबंधित समस्या नहीं^_^