CSS अतिप्रवाह गुण तब काम आता है जब उपयोगकर्ता सामग्री का आकार बदले बिना एक छोटे कंटेनर में बड़ी सामग्री प्रदर्शित करना चाहता है। यह गुण उपयोगकर्ता को सामग्री को क्लिप करने, क्लिप की गई सामग्री को देखने के लिए स्क्रॉलबार प्रदान करने, कंटेनर के बाहर सामग्री प्रस्तुत करने की अनुमति देता है, इस प्रकार नाम अतिप्रवाह।
सिंटैक्स
CSS ओवरफ्लो प्रॉपर्टी के लिए सिंटैक्स निम्नलिखित है -
<पूर्व>चयनकर्ता { अतिप्रवाह:/*मान*/}CSS ओवरफ्लो प्रॉपर्टी के लिए निम्नलिखित मान हैं -
<टेबल> <थेड> क्रमांक <थ> मूल्य और विवरण 1 दृश्यमानयह डिफ़ॉल्ट मान है, सामग्री को क्लिप नहीं किया जाता है और तत्व के बॉक्स के बाहर प्रस्तुत किया जाता है, और इस प्रकार संपत्ति का नाम अतिप्रवाह होता है
2 छिपा हुआ
यह उस सामग्री को क्लिप करता है जो तत्व के बॉक्स को ओवरफ्लो करती है, क्लिप की गई सामग्री दिखाई नहीं देती है
3 स्क्रॉल करें
यह उस सामग्री को क्लिप करता है जो तत्व के बॉक्स को ओवरफ्लो करती है, क्लिप की गई सामग्री दिखाई देती है क्योंकि सामग्री के साथ स्क्रॉलबार भी प्रस्तुत किए जाते हैं
4 स्वतः
यह अतिप्रवाहित सामग्री को देखने के लिए स्क्रॉलबार को स्वचालित रूप से प्रस्तुत करेगा
आइए CSS अतिप्रवाह गुण का एक उदाहरण देखें -
उदाहरण
<हेड> <शीर्षक> सीएसएस ओवरफ़्लो <शैली> फॉर्म { चौड़ाई:70%; मार्जिन:0 ऑटो; टेक्स्ट-एलाइन:सेंटर;}* {पैडिंग:2px; मार्जिन:5 पीएक्स;} इनपुट [टाइप ="बटन"] {बॉर्डर-त्रिज्या:10 पीएक्स;} # कंटेनरडिव {मार्जिन:0 ऑटो; ऊंचाई:100 पीएक्स; चौड़ाई:100 पीएक्स; ओवरफ्लो:ऑटो;}
आउटपुट
किसी भी बटन को क्लिक करने से पहले -
‘स्क्रॉलबार निकालें’ . क्लिक करने के बाद बटन -
आइए CSS ओवरफ्लो प्रॉपर्टी के लिए एक और उदाहरण देखें -
उदाहरण
<हेड> <शीर्षक> सीएसएस ओवरफ़्लो <शैली> फॉर्म { चौड़ाई:70%; मार्जिन:0 ऑटो; टेक्स्ट-एलाइन:सेंटर;}* {पैडिंग:2px; मार्जिन:5 पीएक्स;} इनपुट [टाइप ="बटन"] {बॉर्डर-त्रिज्या:10 पीएक्स;} # कंटेनरडिव {मार्जिन:0 ऑटो; ऊंचाई:110px; अतिप्रवाह:स्क्रॉल;}
आउटपुट
‘स्क्रॉलबार निकालें’ clicking क्लिक करने से पहले बटन -
‘स्क्रॉलबार निकालें’ बटन क्लिक करने के बाद -