CSS overflow प्रभाव
- पिछला पृष्ठ outline-width
- अगला पृष्ठ ओवरफ्लो-एंकर
वर्णन और उपयोग
overflow गुण के द्वारा एलिमेंट के बाहर सामग्री को कैसे संभाला जाएगा को निर्धारित करता है।
वर्णन
इस गुण के द्वारा ओवरफ्लो एलिमेंट के सामग्री को कैसे संभाला जाएगा, यदि मान scroll हो तो, उपयोगकर्ता के द्वारा ज़रूरत के अनुसार या नहीं, उपयोगकर्ता को एक स्क्रॉल सिस्टम मुहैया कराया जाएगा। इसलिए, यदि एलिमेंट के बॉक्स में सभी सामग्री फिट हो, तो भी स्क्रॉल बार दिख सकता है।
और भी देखें:
CSS शिक्षा:CSS स्थानांतरण
HTML DOM संदर्भ दस्तावेज़:overflow गुण
उदाहरण
overflow गुण सेट करना:
div
{
width:150px;
height:150px;
overflow:scroll;
}
CSS व्याकरण
overflow: visible|hidden|clip|scroll|auto|initial|inherit;
गुण मान
| मान | वर्णन |
|---|---|
| visible | मूलभूत मान।सामग्री को कटा नहीं दिया जाता, और यह एलिमेंट के बाहर दिखाई देती है। |
| hidden | सामग्री को कटा दिया जाता है और बाकी सामग्री दिखाई नहीं देती है。 |
| scroll | सामग्री को कटा दिया जाता है, लेकिन ब्राउज़र स्क्रॉल बार दिखाएगा ताकि बाकी सामग्री को देखा जा सके। |
| auto | यदि सामग्री को कटा दिया जाता है, तो ब्राउज़र स्क्रॉल बार दिखाएगा ताकि बाकी सामग्री को देखा जा सके। |
| inherit | परिवार गुण के लिए overflow गुण के मान को अनुसरण करना होगा। |
तकनीकी विवरण
| मूलभूत मान: | visible |
|---|---|
| विरासत करने की क्षमता: | नहीं |
| संस्करण: | CSS2 |
| जावास्क्रिप्ट व्याकरण: | object.style.overflow="scroll" |
और भी कई उदाहरण
- कैसे स्क्रॉल बार को सेट किया जाए ताकि एलिमेंट के अंदर ओवरफ्लो सामग्री को दिखाया जा सके
- इस उदाहरण में दिखाया गया है कि एलिमेंट का सामग्री बहुत बड़ा है और निर्दिष्ट क्षेत्र से बाहर निकलता है, तो overflow गुण को कैसे सेट किया जाए ताकि इसके लिए किसी कार्रवाई को निर्दिष्ट किया जा सके।
- कैसे ओवरफ्लो एलिमेंट में ओवरफ्लो सामग्री को छुपा दिया जाए
- इस उदाहरण में दिखाया गया है कि एलिमेंट में विषय बहुत बड़ा है कि यह निर्दिष्ट क्षेत्र में फिट नहीं होता, तो overflow गुण को कैसे सेट किया जाए ताकि इसका सामग्री छुपा दिया जाए।
- कैसे ब्राउज़र को स्वचालित रूप से ओवरफ्लो को संभालने के लिए सेट किया जाए
- इस उदाहरण में दिखाया गया है कि कैसे ब्राउज़र को स्वचालित रूप से ओवरफ्लो को संभालने के लिए सेट किया जाए।
ब्राउज़र सहायता
तालिका में दिए गए नंबरों से प्रतीत होता है कि इस गुण के लिए पहली सहायक ब्राउज़र की संस्करण कैसे पूरी तरह से समर्थित है।
| च्रोम | IE / एज | फ़ायरफॉक्स | सैफारी | ओपेरा |
|---|---|---|---|---|
| 1.0 | 4.0 | 1.0 | 1.0 | 7.0 |
- पिछला पृष्ठ outline-width
- अगला पृष्ठ ओवरफ्लो-एंकर
