HTML rows एट्रिब्यूट

परिचय

HTML rows एट्रिब्यूट HTML दस्तावेज़ में <textarea> एलिमेंट की दृश्यमान ऊंचाई (पंक्तियों की संख्या में) को परिभाषित करता है। यह टेक्स्ट एरिया की प्रारंभिक ऊंचाई निर्धारित करता है।

सिंटैक्स

<textarea rows="number"></textarea>

उदाहरण

<!DOCTYPE html>
<html>
<style>
  body {
    color: #000;
    height: 100vh;
    background-color: #8BC6EC;
    background-image: linear-gradient(135deg, #8BC6EC 0%, #9599E2 100%);
    text-align: center;
    font-family: Arial, sans-serif;
    padding: 20px;
  }
  textarea {
    font-family: inherit;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    resize: vertical; /* उपयोगकर्ता ऊंचाई बदल सकता है */
  }
</style>
<body>
<h1>HTML rows एट्रिब्यूट डेमो</h1>
<textarea rows="10" cols="20">नमस्ते! मैं कुछ डमी टेक्स्ट वाला एक टेक्स्टएरिया एलिमेंट हूँ।</textarea>
<p style="margin-top: 1rem; color: #666;">यह टेक्स्टएरिया 10 पंक्तियों की ऊंचाई का है (rows="10")।</p>
</body>
</html>

आउटपुट

एक टेक्स्टएरिया दिखाई देगा जिसकी ऊंचाई लगभग 10 टेक्स्ट पंक्तियों के बराबर है। उपयोगकर्ता नीचे-दाएं कोने को खींचकर आकार बदल सकता है (यदि resize अक्षम नहीं है)।

महत्वपूर्ण बिंदु

• rows केवल प्रारंभिक ऊंचाई सेट करता है - CSS height या min-height इसे ओवरराइड कर सकते हैं
• cols एट्रिब्यूट के साथ संयोजित करके चौड़ाई भी सेट करें
• CSS resize: none से रिसाइज़िंग अक्षम करें
• resize: vertical केवल ऊर्ध्वाधर रिसाइज़िंग की अनुमति देता है
• resize: horizontal केवल क्षैतिज रिसाइज़िंग की अनुमति देता है
• resize: both दोनों दिशाओं में अनुमति देता है (डिफ़ॉल्ट)

rows vs CSS height

सर्वोत्तम अभ्यास

<textarea rows="5" style="min-height: 100px; width: 100%; resize: vertical;"></textarea>

ब्राउज़र समर्थन

सभी ब्राउज़रों में पूर्ण समर्थन।