कैसे करें - रिस्पॉन्सिव टेबल्स
प्रतिक्रियाशील तालिका बनाने का तरीका जानें.
उत्तरदायी टेबल्स
यदि स्क्रीन पूरी सामग्री को प्रदर्शित करने के लिए बहुत छोटी है, तो एक प्रतिक्रियाशील तालिका एक क्षैतिज स्क्रॉल बार प्रदर्शित करेगी। प्रभाव देखने के लिए ब्राउज़र विंडो का आकार बदलें:
पहला नाम | अंतिम नाम | अंक | अंक | अंक | अंक | अंक | अंक | अंक | अंक | अंक | अंक | अंक | अंक | अंक | अंक | अंक | अंक | अंक | अंक | अंक |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
जील | लोहार | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 | 50 |
पूर्व संध्या | जैक्सन | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 | 94 |
एडम | जॉनसन | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 | 67 |
overflow-x:auto
रिस्पॉन्सिव टेबल बनाने के लिए, <टेबल> के आस-पास एक कंटेनर एलिमेंट जोड़ें :
उदाहरण
<div style="overflow-x:auto;">
<table>
...
</table>
</div>
नोट: OS X Lion (Mac पर) में, स्क्रॉलबार डिफ़ॉल्ट रूप से छिपे होते हैं और केवल उपयोग किए जाने पर ही दिखाए जाते हैं (भले ही "ओवरफ़्लो: स्क्रॉल" या ऑटो सेट हो)।
टिप: टेबल को स्टाइल करने के तरीके के बारे में अधिक जानने के लिए हमारे CSS टेबल्स ट्यूटोरियल पर जाएं।