इसके अंदर <p> टैग में <div> टैग क्यों नहीं हो सकता है?


169

जहाँ तक मुझे पता है, यह सही है:

<div>
  <p>some words</p>
</div>

लेकिन यह गलत है:

<p>
  <div>some words</div>
</p>

पहला W3C सत्यापनकर्ता (XHTML 1.0) पास कर सकता है , लेकिन दूसरा नहीं कर सकता। मुझे पता है कि कोई भी दूसरे की तरह कोड नहीं लिखेगा। मैं सिर्फ यह जानना चाहता हूं कि क्यों।

और अन्य टैग्स के संबंध संबंध के बारे में क्या?


9
क्योंकि <p>एक ब्लॉक स्तर का तत्व है, और पाठ को प्रदर्शित करने के लिए (माना जाता है) का उपयोग किया जाता है, यह इसके अंदर अन्य ब्लॉक स्तर के तत्वों की अनुमति नहीं देगा, लेकिन केवल इनलाइन जैसे <span>और <strong>
बोजैंगल्स

22
JamWaffles: यह pएक ब्लॉक स्तर का तत्व है, जिसका इससे कोई लेना-देना नहीं है। divएक भी है और अन्य ब्लॉकों की अनुमति देता है।
जॉय

इसका डुप्लिकेट संभव है: stackoverflow.com/questions/4967976/… (अनफ्लैग्ड): इसका कोई भी सभ्य उत्तर इस बात का जवाब देगा कि HTML युक्ति कैसे पढ़ें और इस प्रकार इसका उत्तर भी दें।
सिरो सांटिल्ली 郝海东 iro i i

इनलाइन के रूप में div की शैली की घोषणा करना भी काम नहीं करता है।
त्रिकोको

जवाबों:


198

अनुमत संबंध संबंधों को देखने के लिए एक आधिकारिक जगह HTML कल्पना है। उदाहरण के लिए, http://www.w3.org/TR/html4/sgml/dtd.html देखें । यह निर्दिष्ट करता है कि कौन से तत्व ब्लॉक तत्व हैं और कौन से इनलाइन हैं। उन सूचियों के लिए, "HTML सामग्री मॉडल" वाले अनुभाग को खोजें।

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

<!ELEMENT P - O (%inline;)*            -- paragraph -->

यह http://www.w3.org/TR/html401/struct/text.html#h-9.3.1 के अनुरूप है , जो कहता है कि P तत्व में "ब्लॉक स्तर के तत्व (P खुद सहित) नहीं हो सकते।"


74
मुझे चश्मे से बचने की आदत है, हमारे पास इस तरह की चीजों के लिए सबसे अधिक आधिकारिक दस्तावेज हैं, क्योंकि वे पढ़ने में मजेदार नहीं हैं। +1 वास्तव में उन्हें पढ़ने, उन्हें समझने और सवालों के जवाब देने के लिए उनका उपयोग करने के लिए।
स्टूटी

3
क्या यह अभी भी HTML 5 के लिए मान्य है? विशेष रूप से जुड़ा हुआ एचटीएमएल 4, और एचटीएमएल 5 से जुड़ी युक्ति में दस्तावेज़ प्रकार की परिभाषा नहीं है
Ajedi32

2
@ Ajedi32 हाँ, यहाँ । एचटीएमएल 5 ने बहुत सारी शब्दावली का नाम बदल दिया है, लेकिन "अनुमत सामग्री: सामग्री को संक्षिप्त करना" का अर्थ %inlineऊपर के बिट के समान है। ओरोल का जवाब भी देखें।
श्री लिस्टर

@Stoutie हां के साथ सही है, इसलिए स्टैक ओवरफ्लो मौजूद है।
कप्तान हाइपरटेक्स्ट

69

संक्षेप में, DOM में एक <div>तत्व को अंदर रखना असंभव है <p>क्योंकि उद्घाटन <div>टैग स्वचालित रूप से <p>तत्व को बंद कर देगा ।


2
आह, यह बताता है कि एपी के अंदर एक div से पहले एक विशाल स्थान क्यों है, क्योंकि पी वास्तव में div से ठीक पहले समाप्त होता है।
एरोनल्स

2
आप DOM , उदा जैसे किसी तत्व को अंदर रख सकते हैं । लेकिन एक HTML पार्सर ऐसा नहीं करेगा। divp myP.appendChild(myDiv)
ओरोल

1
ऐसा मत करो। आपको पता नहीं है कि भविष्य के ब्राउज़रों में इसका क्या जवाब होगा। प्रौद्योगिकी लगातार बदल रही है। एक गतिशील HTML पार्सर हो सकता है जो एक दिन को अमान्य बना देगा। वेब देव में लक्ष्य उन चीजों का निर्माण करना है, जो वांछित और कुछ हद तक संगत होने की क्षमता रखते हैं। यदि आप यह बता सकते हैं कि ब्राउज़र क्या अनुमति देता है, तो यह कहना सुरक्षित है कि आप यह सुनिश्चित नहीं कर सकते कि यह हमेशा के लिए काम करेगा। बस एक स्पैन दोस्तों का उपयोग करें ... यदि आपको डिव की आवश्यकता है, तो पी टैग का उपयोग करना बंद करें।

39

एचटीएमएल 5 के अनुसार, सामग्री मॉडल के divतत्वों है प्रवाह सामग्री

दस्तावेजों और अनुप्रयोगों के शरीर में उपयोग किए जाने वाले अधिकांश तत्वों को प्रवाह सामग्री के रूप में वर्गीकृत किया जाता है।

इसमें ऐसे pतत्व शामिल हैं, जिनका उपयोग केवल वहीं किया जा सकता है जहां प्रवाह सामग्री अपेक्षित है।

इसलिए, divतत्वों में pतत्व शामिल हो सकते हैं ।


हालांकि, सामग्री मॉडल के pतत्वों है Phrasing सामग्री

फ़्रेसिंग सामग्री दस्तावेज़ का पाठ है, साथ ही ऐसे तत्व जो उस पाठ को इंट्रा-पैरा स्तर पर चिह्नित करते हैं। की चलाता है phrasing सामग्री प्रपत्र पैराग्राफ

इसमें ऐसे divतत्व शामिल नहीं हैं , जिनका उपयोग केवल वहीं किया जा सकता है जहाँ प्रवाह सामग्री अपेक्षित है।

इसलिए, pतत्वों में divतत्व नहीं हो सकते ।

चूंकि समाप्ति टैग के pतत्वों जब छोड़ा जा सकता है pतत्व तुरंत एक के बाद आता है divतत्व (दूसरों के बीच), निम्नलिखित

<p>
  <div>some words</div>
</p>

के रूप में पार्स किया जाता है

<p></p>
<div>some words</div>
</p>

और अंतिम </p>एक त्रुटि है।


लेकिन अगर सीएसएस में अगर मैं इनलाइन होने के लिए सेट करता हूं तो यह सम्मान क्यों नहीं दे रहा है?
संजय

चूंकि सीएसएस मान डोम पार्सिंग के बाद लागू होते हैं ... भले ही हम div as inline in CSSइसका कोई उपयोग नहीं करते हैं, क्योंकि नई पार्स की गई संरचना <p>Text</p> <div>some words</div> <p></p> क्या मेरी समझ सही है?
संजय

@ संजी हां, लगता है कि आप सही हैं। और इसके अलावा, मेरी टिप्पणियों के दौरान, यदि आप <p> <p> के अंदर डालते हैं और फिर स्पान के प्रदर्शन को "ब्लॉक" में सेट करते हैं, तो इसे इस तरह के प्रभाव के बिना एक विशिष्ट ब्लॉक तत्व के रूप में प्रदान किया जाएगा।
एंड्री नौमोविच

-1

एक्स एचटीएमएल के बाद, सम्मेलनों को बदल दिया गया है, और अब यह एक्सएमएल और एचटीएमएल के सम्मेलनों का मिश्रण है, इसीलिए दूसरा दृष्टिकोण गलत है और W3C सत्यापनकर्ता उन चीजों को सही मान लेता है जो मानकों और सम्मेलनों के अनुसार हैं।


XHTML में ज्यादा बदलाव नहीं हुआ। पी तत्व को कभी भी एक दिव्य तत्व शामिल करने की अनुमति नहीं दी गई है।
क्वेंटिन

-7

क्योंकि divटैग की तुलना में pटैग की पूर्वता अधिक होती है । pजबकि टैग किसी अनुच्छेद टैग का प्रतिनिधित्व करता है divटैग एक दस्तावेज टैग प्रतिनिधित्व करता है।

आप एक दस्तावेज़ टैग में कई पैराग्राफ लिख सकते हैं, लेकिन आप एक पैराग्राफ़ में दस्तावेज़ नहीं लिख सकते हैं। DOC फ़ाइल के समान।


2
दरअसल, यह विभाजन है। अन्यथा यह होगा <doc>: D
काइल

6
वरीयता एक अवधारणा नहीं है जो html तत्वों पर लागू होती है, और div एक विभाजन का प्रतिनिधित्व करता है, जैसा @KyleSevenoaks कहते हैं :)
SimpleGy

DOC फाइल क्या है? एक Microsoft Word फ़ाइल?
पीटर मोर्टेंसन
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.