पाठ-अतिप्रवाह - सीएसएस-ट्रिक्स

text-overflowसीएसएस में संपत्ति स्थितियों में, जहां पाठ काटा गया है जब यह तत्व का पिटारा overflows से संबंधित है। इसे क्लिप किया जा सकता है (यानी काट दिया गया, छिपाया गया), एक दीर्घवृत्त ('...', यूनिकोड रेंज वैल्यू U + 2026) प्रदर्शित करें या एक लेखक-परिभाषित स्ट्रिंग (लेखक द्वारा परिभाषित स्ट्रिंग्स के लिए कोई वर्तमान ब्राउज़र समर्थन) प्रदर्शित न करें।

.ellipsis ( text-overflow: ellipsis; /* Required for text-overflow to do anything */ white-space: nowrap; overflow: hidden; )

ध्यान दें कि text-overflowकेवल तब होता है जब कंटेनर की overflowसंपत्ति के मूल्य है hidden, scrollया autoऔर white-space: nowrap;।

टेक्स्ट ओवरफ़्लो केवल ब्लॉक या इनलाइन-ब्लॉक स्तर के तत्वों पर हो सकता है, क्योंकि ओवरफ़्लो-एड होने के लिए तत्व को चौड़ाई की आवश्यकता होती है। दिशा या संपत्ति या संबंधित विशेषताओं के अनुसार दिशा में अतिप्रवाह होता है।

निम्न डेमो text-overflowसभी संभावित मूल्यों सहित संपत्ति के व्यवहार को प्रदर्शित करता है । ब्राउज़र समर्थन बदलता है!

इस पेन को देखें!

सेटिंग overflowकरने scrollया autoकरने के लिए स्क्रॉलबार प्रदर्शित करेगा, जबकि hiddenऐसा नहीं होगा। छिपे हुए पाठ का चयन दीर्घवृत्त का चयन करके किया जा सकता है।

पुराना माल

कल्पना का एक पुराना संस्करण कहता है कि आप एक URL का उपयोग एक दीर्घवृत्त के लिए एक छवि के लिए कर सकते हैं, लेकिन ऐसा लगता है कि इसे गिरा दिया गया था।

उदाहरण के लिए text-overflow: ellipsis ellipsis;, दो-मूल्य सिंटैक्स है, जो एक ही कंटेनर के बाईं और दाईं ओर अतिप्रवाह को नियंत्रित करेगा। मुझे यकीन नहीं है कि यह कैसे संभव होगा। शायद एक बहुत छोटे कंटेनर में पाठ केंद्रित? नया युक्ति यह कहता है, साथ ही एक स्ट्रिंग को परिभाषित करना, "जोखिम में" है।

मुझे यकीन नहीं है कि कहाँ से ellipsis-wordआया हूँ यह WebPlatform.org पर इसके अलावा किसी अन्य दस्तावेज या अन्य दस्तावेज में नहीं है।

text-overflowइस्तेमाल किया संपत्ति के संयोजन के लिए आशुलिपि होने के लिए text-overflow-modeऔर text-overflow-ellipsisहै, लेकिन अब और नहीं है और उन अलग-अलग प्रॉपर्टी मौजूद नहीं हैं।