0 सवाल: कैसे प्राप्त करें :: सामग्री प्रदर्शित करने के बाद? [डुप्लिकेट]

पर बनाया गया सवाल Wed, May 8, 2019 12:00 AM

मुझे CSS :after संपत्ति के व्यवहार को समझने में परेशानी हो रही है। युक्ति के अनुसार ( यहां और here ):

  

जैसा कि उनके नाम इंगित करते हैं, 06003509911001001350350 और :before छद्म तत्व तत्व के दस्तावेज़ ट्री सामग्री से पहले और बाद में सामग्री का स्थान निर्दिष्ट करते हैं।

इस पर प्रतिबंध नहीं लगता है कि किन तत्वों पर :after (या :after) संपत्ति हो सकती है। हालाँकि, यह केवल विशिष्ट तत्वों के साथ काम करने लगता है ... :before काम करता है, <p>, <img>, <input> पर नहीं। मैं और अधिक परीक्षण कर सकता हूं, लेकिन बिंदु बना हुआ है। ध्यान दें कि यह ब्राउज़र में बहुत सुसंगत लगता है। क्या निर्धारित करता है कि कोई वस्तु <table> और :before संपत्ति स्वीकार कर सकती है?

    
95
3 उत्तर                              3                         

:after और img दोनों बदले हुए तत्वों हैं। p>

  

एक प्रतिस्थापित तत्व कोई भी तत्व है जिसका स्वरूप और आयाम हैं   बाहरी संसाधन द्वारा परिभाषित। उदाहरणों में चित्र (input टैग) शामिल हैं,   प्लगइन्स (<img> टैग), और फार्म तत्व (<object>, <button>)   <textarea>, और <input> टैग)। अन्य सभी प्रकार के तत्वों को संदर्भित किया जा सकता है   गैर-प्रतिस्थापित तत्वों के रूप में।

<select> और :before केवल गैर-प्रतिस्थापित तत्वों के साथ काम करते हैं।

युक्ति से:

  

ध्यान दें। यह विनिर्देश पूरी तरह से सहभागिता को परिभाषित नहीं करता है   :after और :before बदले हुए तत्वों (जैसे HTML में IMG) के साथ। इस   भविष्य के विनिर्देश में अधिक विस्तार से परिभाषित किया जाएगा।

:after के साथ, DOM इस प्रकार दिखता है:

span:before, span:after

जाहिर है, यह

<span><before></before>Content of span<after></after></span>
के साथ काम नहीं करेगा।     
143
2017-10-18 09: 51: 44Z
  1. " जेनरेट की गई सामग्री दस्तावेज़ ट्री में परिवर्तन नहीं करती है। " इसलिए मुझे आश्चर्य होगा अगर आप स्रोत में "<img src="" />" जैसा कुछ पा सकते हैं।
    2011-08-04 22: 36: 18Z
  2. @ Knu: आप सही कह रहे हैं, मैंने इसे खराब तरीके से समझाया। आपको कभी भी <before></before> नहीं मिलेगा। मुझे "प्रिटेंड डोम" या कुछ और कहना चाहिए। बिंदु यह दिखाना था कि <before></before> और :before तत्व के अंदर हैं, इसके बाहर नहीं।
    2011-08-04 22: 39: 10Z
  3. मुझे आश्चर्य है कि अगर वे छाया DOM
    में संग्रहीत हैं।
    2011-08-04 23: 45: 48Z
  4. नहीं, वे छाया DOM में संग्रहीत नहीं हैं।
    2014-06-24 12: 19: 49Z
  5. उद्धृत किया गया उद्धरण यह नहीं कहता है कि :after और :before बदले हुए तत्वों के लिए काम नहीं करते हैं; यह सिर्फ यह कहता है कि यह "पूरी तरह से" परिभाषित नहीं करता है कि यह कैसे और भविष्य में परिभाषित किया जाएगा (जो अब तक नहीं हुआ है)। DOM में जो होता है वह यहाँ अप्रासंगिक है। जबकि ब्राउज़र कुछ तत्वों के लिए इन छद्म तत्वों का समर्थन नहीं करते हैं, यह चश्मा में नहीं है, बस कार्यान्वयन क्या करते हैं।
    2014-10-15 05: 55: 12Z
प्रतिस्थापित तत्वों के लिए काम करने के लिए

:after और :before आवश्यकता नहीं है और सीएसएस विनिर्देशों निर्दिष्ट नहीं करते हैं कि वे उनके लिए कैसे काम करेंगे, और प्रतिस्थापित तत्व की अवधारणा कुछ अस्पष्ट है।

CSS 2.1 विनिर्देश स्पष्ट रूप से सुझाव देता है कि वे कर सकते हैं प्रतिस्थापित तत्वों के लिए काम करते हैं, बस यह कहते हुए कि यह कैसे "पूरी तरह से परिभाषित" नहीं करता है। यह इस मुद्दे से संबंधित है कि एक बदले हुए तत्व की अपनी दृश्य रेंडरिंग होने की उम्मीद है, जो सीएसएस द्वारा नियंत्रित नहीं है, जबकि छद्म तत्वों को तत्व की सामग्री में कुछ जोड़ना चाहिए। यह सुनिश्चित करता है कि इसे भविष्य के विनिर्देशन में "अधिक विस्तार से" परिभाषित किया जाएगा, लेकिन यह अब तक नहीं हुआ है।

ब्राउज़र विक्रेताओं ने बस कुछ तत्वों के लिए इन छद्म तत्वों को लागू नहीं करके समस्याओं से बचने का फैसला किया।

यह बिल्कुल स्पष्ट नहीं है कि "प्रतिस्थापित तत्व" का क्या अर्थ है, और अर्थ कुछ हद तक बदल गया है। इसे अक्सर खाली तत्व (0600350991100101035062 के साथ एक तत्व के रूप में एक तत्व, यानी एक तत्व जिसमें कोई सामग्री नहीं हो सकती) के रूप में व्याख्या की जाती है, लेकिन CSS 2.1 में ही एक नमूना शैली शीट चयनकर्ता के साथ :after (हालांकि ब्राउज़रों ने इस पर ध्यान नहीं दिया है, 0600350991100101035062 को अपने तरीके से लागू करते हैं)। यह तर्क दिया जा सकता है कि कम से कम भाग में अधिक से अधिक तत्व सीएसएस प्रतिपादन के दायरे में चले गए हैं। उदाहरण के लिए, एक EMPTY तत्व (इसके फ़ॉन्ट, रंग, आदि को शामिल करना) आधुनिक ब्राउज़रों में सीएसएस के साथ काफी हद तक नियंत्रणीय है।

वर्तमान ब्राउज़र (फ़ायरफ़ॉक्स, आईई, क्रोम) br:before और br छद्म तत्वों को 060035099111100100135062 के अलावा अन्य खाली तत्वों के लिए सपोर्ट नहीं करते हैं। 0600350991100100135062, IE के लिए और क्रोम एक बॉर्डर बॉक्स के अंदर जेनरेट किए गए कंटेंट को जगह देता है। का input; सामग्री बॉक्स को लंबा बनाती है। फ़ायरफ़ॉक्स क्षैतिज नियम है कि :after के कार्यान्वयन के बाद दोनों (!) छद्म तत्वों की सामग्री को रखता है। यह भिन्नता सीएसएस 2.1 में संदर्भित "इंटरैक्शन" समस्याओं के प्रकार को दर्शाती है।

अक्सर यह दावा किया जाता है कि इन छद्म तत्वों का उपयोग खाली तत्वों के लिए नहीं किया जा सकता है क्योंकि उनकी HTML परिभाषाएं किसी भी सामग्री की अनुमति नहीं देती हैं। यह एक श्रेणी त्रुटि है। एक मार्कअप भाषा के वाक्यविन्यास नियम सीएसएस

में आप क्या कर सकते हैं प्रतिबंधित नहीं करते हैं

निष्कर्ष निकालने के लिए, 0600350991100101035062 और :before वर्तमान में खाली तत्वों (0600350991100101035062 के लिए मामूली छोड़कर) के लिए उपयोग करने योग्य नहीं हैं, लेकिन यह मुख्य रूप से कार्यान्वयन के कारण है और भविष्य में बदल सकता है।

    
9
2014-10-15 06: 27: 53Z

जिन तत्वों में क्लोजिंग टैग नहीं है वे शून्य तत्व हैं और वे उनके अंदर सामग्री प्रदर्शित नहीं कर सकते:

https://www.w3.org/TR/html5 /syntax.html#void-elements

सभी ब्लिंक, वेबकिट और क्वांटम ब्राउज़र आपको चेकबॉक्स पर केवल छद्म तत्व बनाने की अनुमति देते हैं, लेकिन यह विवादास्पद है क्योंकि कोई भी कल्पना इस व्यवहार की अनुमति नहीं देती है।

यहां एक उदाहरण है: https://codepen.io/equinusocio/pen/BOBaEM=

hr     
- 1
2018-08-19 16: 11: 20Z
  1. यह सभी ब्राउज़र में काम नहीं करेगा ... और कोई विनिर्देश नहीं है जो कहता है कि अब हम कर सकते हैं .. यदि आपके पास एक है कृपया इसे साझा करें क्योंकि इनपुट
    के साथ छद्म तत्व पर विचार करना सुरक्षित नहीं है
    2018-08-18 14: 55: 40Z
  2. यह IE को छोड़कर सभी ब्राउज़रों में काम करता है। यहां तक ​​कि फ्लेक्सबॉक्स IE 9 द्वारा समर्थित नहीं है इसलिए समस्या कहां है। यह समाधान सभी ब्लिंक, वेबकिट और क्वांटम ब्राउज़रों पर काम करता है और उन लोगों के लिए बहुत उपयोगी हो सकता है जो इलेक्ट्रॉन जैसे वेबकिट-केवल वातावरण पर काम करते हैं।
    2018-08-19 16: 08: 39Z
  3. जैसा आपने अपने उत्तर में कहा था, इसके लिए कोई युक्ति नहीं है, इसलिए एक दिन यह काम करना बंद कर सकता है। यह एकमात्र ऐसी चीज नहीं है जो किसी भी परिभाषित परिभाषित किए बिना व्यवहार करती है और काम करती हैहमें कभी भी उन पर भरोसा नहीं करना चाहिए और कहना चाहिए कि वे काम करते हैं। यह मोटे टैग की तरह है, वे अभी भी काम करते हैं लेकिन हमें उनका उपयोग करना बंद कर देना चाहिए क्योंकि एक दिन वे नहीं करेंगे। तो हाँ यह लोगों के लिए उपयोगी हो सकता है और मेरी टिप्पणी लोगों को चेतावनी देने के लिए भी उपयोगी है कि उन्हें इस बात की जानकारी होनी चाहिए कि यह आधिकारिक नहीं है।
    2018-08-19 19: 06: 54Z
    hr
स्रोत रखा गया यहाँ