307

हर बार जब मैं एक नया रूप विकसित करता हूं, जिसमें textareaमेरे पास एक निम्न दुविधा होती है जब मुझे इसके आयाम निर्दिष्ट करने की आवश्यकता होती है:

CSS का उपयोग करें या textareaविशेषताओं का उपयोग करें colsऔर rows?

प्रत्येक विधि के पेशेवरों और विपक्ष क्या हैं?

इन विशेषताओं का उपयोग करने के शब्दार्थ क्या हैं?

यह आमतौर पर कैसे किया जाता है?

html css textarea

— Pherrymason
स्रोत

268

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

इसे करने का अनुशंसित तरीका बाहरी स्टाइलशीट उदा

textarea {
  width: 300px;
  height: 150px;
}

<textarea> </textarea>

स्निपेट का विस्तार करें

— kogakure
स्रोत

4

यह ठीक है, लेकिन आपको यह महसूस करना होगा कि आप जो भी मनमाना स्थान निर्धारित कर रहे हैं, वह बेकार जा रहा है और वास्तव में सिर्फ दिखाने के लिए है।

— धमाका गोलियां

4

@ टांडू: आपका क्या मतलब है "बेकार जा रहा है और वास्तव में सिर्फ दिखाने के लिए है"?

— BoltClock

2

पंक्तियाँ / कॉल उपयोगकर्ता के चरित्र आकार पर आधारित हैं। इसलिए यदि आपके पास एक सीएसएस-परिभाषित चौड़ाई / ऊँचाई है जिसे टेक्स्टारिया में एक चरित्र के पिक्सल्स द्वारा विभाजित नहीं किया जा सकता है, तो वहाँ है कि बहुत अधिक श्वेतपत्र लंबवत और क्षैतिज रूप से बचे हैं। शायद कोई भी कभी नोटिस नहीं करेगा, लेकिन सिर्फ Sayin।

— विस्फोट

21

आप पिक्सल के बजाय माप के रूप में "एम" का उपयोग कर सकते हैं। 1em किसी भी फ़ॉन्ट और आकार में "M" की चौड़ाई है। लेकिन कर्नल केवल प्रासंगिक होते हैं यदि मोनोसेप्स फोंट के साथ उपयोग किया जाता है, जो कि अधिकांश डिज़ाइनों में होता है न कि मामला। ऊंचाई में एक आदर्श फिटिंग प्राप्त करने के line-heightलिए अपने textarea की ऊंचाई के लिए कई का उपयोग करें।

— kogakure

5

@LeoGalleguillos "आवश्यक और उपयोगी है अगर ग्राहक सीएसएस का समर्थन नहीं करता है "। मान्यता के बारे में किसी ने कुछ नहीं कहा।

— जानूस बह्स जेकेट

96

textarea { height: auto; }

<textarea rows="10"></textarea>

स्निपेट का विस्तार करें

यह textarea की ऊंचाई सेट करने के लिए ब्राउज़र को ट्रिगर करेगा। इसके अलावा पंक्तियों की मात्रा इसके चारों ओर पैडिंग भी। पिक्सेल की सटीक मात्रा में सीएसएस ऊंचाई सेट करना मनमाने ढंग से व्हाट्सएप छोड़ देता है।

— जान वेरखोव
स्रोत

4

Unfortunatelly, "Textarea की ऊंचाई फ़ायरफ़ॉक्स में पंक्तियों से मेल नहीं खाती" - यह "पंक्तियाँ + 1" stackoverflow.com/q/7695945/1266880

— apurkrt

2

यह निश्चित नहीं है कि '13 'के बाद से चीजें बदल गई हैं या मेरी विशेष स्थिति के बारे में कुछ गैर-स्पष्ट है या नहीं, लेकिन height: auto;सीएसएस में सेटिंग मेरे पाठयक्रम को बिल्कुल प्रभावित नहीं करती है।

— clozach

10

डब्ल्यू 3 सी के अनुसार, कॉलार और पंक्तियों दोनों को टेक्स्टारिस के लिए आवश्यक गुण हैं। पंक्तियों और कर्ल्स उन वर्णों की संख्या है जो पिक्सेल या कुछ अन्य संभावित मनमाने मूल्य के बजाय टेक्स्टारिया में फिट होने जा रहे हैं। पंक्तियों / बछियों के साथ जाओ।

— विस्फोट गोलियां
स्रोत

8

w3c स्कूलों का कहना है कि आप इसे पंक्तियों और बछड़ों की विशेषता के माध्यम से सेट कर सकते हैं, लेकिन यह कि ऊंचाई और चौड़ाई सेट करना बेहतर है। W3c.org पर textarea के लिए पंक्तियों और बस्तियों के एक आवश्यक विशेषता होने का कोई उल्लेख नहीं है। w3schools.com/tags/tag_textarea.asp w3.org/wiki/HTML/Elements/textarea

— माइकल Stramel

17

@MichaelStramel मेरा उत्तर चार साल पुराना है - वैसे यह स्कूलों में w3c नहीं है । वे संबद्ध नहीं हैं। मुझे यकीन नहीं है कि HTML5 में आवश्यक विशेषताओं की अवधारणा है , लेकिन मैं इसके बारे में गलत हो सकता हूं। मैं अभी भी नहीं देखता कि चौड़ाई / ऊँचाई सेट करना पंक्तियों / कॉलनों से बेहतर क्यों होगा

— धमाका गोलियां

3

मुझे एहसास हुआ कि मैंने टिप्पणी करने के बाद भी यह महसूस किया कि यह इस पोस्ट को पढ़ने वाले किसी भी व्यक्ति के लिए प्रासंगिक है। जब तक वे जावास्क्रिप्ट के माध्यम से सेट नहीं होते हैं, तब भी उत्तरदायी डिजाइनों के साथ, पंक्तियों और कर्नल मुद्दों का कारण बन सकते हैं। वह IMO इसे CSS के माध्यम से बेहतर तरीके से स्थापित करता है।

— माइकल स्ट्रैमल

6

इसका जवाब है हाँ"। यानी आपको दोनों का इस्तेमाल करना चाहिए। पंक्तियों और कॉलों के बिना (और डिफ़ॉल्ट मान भी हैं यदि आप उन्हें स्पष्ट रूप से उपयोग नहीं करते हैं) तो textarea असामान्य रूप से छोटा है यदि CSS को निष्क्रिय किया गया है या उपयोगकर्ता स्टाइलशीट द्वारा ओवरराइड किया गया है। हमेशा पहुंच संबंधी चिंताओं को ध्यान में रखें। कहा जा रहा है कि, यदि आपकी स्टाइलशीट को टैक्स्टेरिया की उपस्थिति को नियंत्रित करने की अनुमति है, तो आप आम तौर पर किसी ऐसी चीज से हवा निकालेंगे जो पूरी तरह से बेहतर दिखती है, समग्र पेज डिजाइन में अच्छी तरह से फिट बैठती है, और उपयोगकर्ता इनपुट के साथ रखने के लिए आकार बदल सकती है ( अच्छे स्वाद की सीमा के भीतर, निश्चित रूप से)।

— स्टेन रोजर्स
स्रोत

6

पाठ क्षेत्र के लिए हम आकार को ठीक करने के लिए सीएसएस से नीचे का उपयोग कर सकते हैं

    <textarea  class="form-control" style=" min-width:500px; max-width:100%;min-height:50px;height:100%;width:100%;" ></textarea>

कोणीयज और कोणीय 7 में परीक्षण किया गया

— रोहित परते
स्रोत

1

एंगुलर से इसका क्या लेना-देना है? और यह 2010 से मौजूदा जवाबों की तुलना में कैसे जोड़ता है

— Lazar Ljubenović

5

 <textarea style="width:300px; height:150px;" ></textarea>

— user470962
स्रोत

19

@ user470962 विज्ञापन गृहिणी यदि आप '<textarea style = "चौड़ाई: 300px; वाक्यविन्यास त्रुटि को ठीक करते हैं; ऊंचाई: 150px;">' तो कोड ठीक है। किसी का अपमान करने की जरूरत नहीं है। जैसा कि आप देख सकते हैं सबसे लोकप्रिय जवाब उसके विपरीत नहीं है। +1

— TAAPSogeking

1

@TAAPSogeking निष्पक्षता में, यह वही जवाब है, 4 साल बाद। -1

— रामबातिनो

4

एक textarea का आकार कॉल और पंक्तियों की विशेषताओं, या इससे भी बेहतर द्वारा निर्दिष्ट किया जा सकता है; सीएसएस 'ऊंचाई और चौड़ाई गुणों के माध्यम से। सभी प्रमुख ब्राउज़रों में कोलाज़ विशेषता का समर्थन किया जाता है। एक मुख्य अंतर यह है कि <TEXTAREA ...>एक कंटेनर टैग है: इसमें एक स्टार्ट टैग () है।

— AsifQadri
स्रोत

2

मैं आमतौर पर निर्दिष्ट नहीं करते हैं height, लेकिन उल्लेख करूं width: ...और rowsऔर cols।

आमतौर पर, मेरे मामलों में, केवल widthऔर rowsकी आवश्यकता होती है, अन्य लोम्स के संबंध में टेक्सटेरिया को अच्छा दिखने के लिए। (और colsअगर किसी ने सीएसएस का उपयोग नहीं किया है, तो यह एक अन्य उदाहरणों में बताया गया है)।

((दोनों को निर्दिष्ट करना rowsऔर heightमुझे लगता है कि नकल डेटा की तरह थोड़ा सा लगता है?))

— KajMagnus
स्रोत

2

टेक्स्टारिस की एक प्रमुख विशेषता यह है कि वे विस्तार योग्य हैं। एक वेब पेज पर यह टेक्स्ट क्षेत्र पर दिखाई देने वाली स्क्रॉल पट्टियों के परिणामस्वरूप हो सकता है यदि पाठ की लंबाई आपके द्वारा निर्धारित स्थान से अधिक हो (पंक्तियों का उपयोग करते हुए, या सीएसएस का उपयोग कर रहे हों। यह तब समस्या हो सकती है जब उपयोगकर्ता प्रिंट करने का निर्णय लेता है, विशेष रूप से। पीडीएफ के लिए 'प्रिंटिंग' - तो सशर्त सीएसएस नियम के साथ मुद्रित टेक्स्टारिस के लिए एक आराम से बड़ी न्यूनतम ऊंचाई निर्धारित करें:

@media print { 
textarea {
min-height: 900px;  
}
}

— ज्योफ केंडल
स्रोत

2

यदि आप हर बार लाइन-ऊँचाई का उपयोग नहीं करते हैं: '..'; textarea की चौड़ाई और textarea की चौड़ाई के लिए चौड़ाई संपत्ति को नियंत्रित करता है।

या आप सीएसएस का पालन करके फ़ॉन्ट-आकार का उपयोग कर सकते हैं:

#sbr {
  font-size: 16px;
  line-height:1.4;
  width:100%;
}

— नुरिलम सब्बीर
स्रोत

2

HTML पंक्तियाँ और कॉल उत्तरदायी नहीं हैं!

तो मैं सीएसएस में आकार को परिभाषित करता हूं। एक टिप के रूप में: यदि आप मोबाइल के लिए एक छोटे आकार को परिभाषित करते हैं तो उपयोग करने के बारे में सोचेंtextarea:focus {};

यहां कुछ अतिरिक्त स्थान जोड़ें, जो केवल उस क्षण को प्रकट करेगा जो उपयोगकर्ता वास्तव में कुछ लिखना चाहता है

— कोई व्यक्ति
स्रोत

-11

सीएसएस

input
{
    width: 300px;
    height: 40px;
}

एचटीएमएल

<textarea rows="4" cols="50">HELLO</textarea>

— आशु
स्रोत

आप बहुत आसानी से सीएसएस के साथ कर सकते हैं

— ASHU

आप सीएसएस द्वारा दोनों तरह से कर सकते हैं या आप इस तरह से मैन्युअल रूप से फ़ीड कर सकते हैं <textarea पंक्तियों = "4" cols = "50"> HELLO </ textarea>

— ASHU

आप उन गुणों को सभी तत्वों पर क्यों लागू करेंगे?

— ब्लैकमम्बो

क्या मुझे सीएसएस की चौड़ाई / ऊंचाई या एचटीएमएल कॉल / पंक्तियों की विशेषताओं के साथ एक टेक्स्टारिया आकार देना चाहिए?

सीएसएस

एचटीएमएल