कब उपयोग करना है <span> इसके बजाय <p>?


94

जैसा कि प्रश्न इंगित करता है, अगर मेरे पास कुछ पाठ है जो मुझे HTML में जोड़ना है तो मुझे <p>कब उपयोग करना चाहिए और कब उपयोग करना चाहिए <span>?

जवाबों:


91

आपको ध्यान रखना चाहिए, कि HTML का उद्देश्य उस सामग्री को DESCRIBE करना है जिसमें यह शामिल है।

तो, यदि आप एक पैराग्राफ को व्यक्त करना चाहते हैं, तो ऐसा करें।

आपकी तुलना बिल्कुल सही नहीं है, हालांकि। जितनी सीधी तुलना होगी

एक के <div>बजाय का उपयोग कब करें <p>?

जैसा कि दोनों ब्लॉक स्तर के तत्व हैं।

<span>इनलाइन है, जो एक एंकर ( <a>), <strong>जोर, ( <em>), इत्यादि के समान है, इसलिए यह ध्यान में रखें कि यह html और प्राकृतिक लेखन दोनों में डिफ़ॉल्ट प्रकृति है, कि एक पैराग्राफ पहले और बाद में एक विराम का कारण होगा, जैसे <div>

कभी-कभी, जब स्टाइलिंग चीजें - इनलाइन चीजें - <span>आपको सीएसएस को "हुक" करने के लिए कुछ देने के लिए बहुत अच्छा है, लेकिन यह अन्यथा शब्दार्थ या शैलीगत अर्थ से रहित एक खाली टैग है।


7
इनलाइन बनाम ब्लॉक तत्वों की तुलना करते समय, ध्यान रखें कि दृश्य पहलुओं का वर्णन न करें। जैसा कि एचटीएमएल 5 कल्पना कहती है, pजरूरी नहीं कि आसपास की रेखा के टूटने के साथ स्टाइल किया जा सकता है, उदाहरण के लिए, यह एक इनलाइन पाइलो प्रतीक द्वारा पीछा किया जा सकता है । "इनलाइन" और "ब्लॉक" शब्द का अर्थ अंधे उपयोगकर्ताओं के लिए कुछ भी नहीं है। बल्कि, फ़्लो कंटेंट और कॉन्टैसिंग कंटेंट के बीच अंतर बनाएं ( इस लिंक को देखें )।
छेरवे

3
इसके अलावा, पेडिंग-लेफ्ट अलग-अलग तरह pसे व्यवहार करता है, जैसा कि वह करता है span। पैराग्राफ पर, पैडिंग हर लाइन (टेक्स्ट के ब्लॉक) को प्रभावित करता है, जबकि स्पैन पर यह केवल पहली लाइन को प्रभावित करता है।
डायनेवाला

95

शब्दार्थ, आप <p>पैराग्राफ को इंगित करने के लिए टैग का उपयोग करते हैं । <span>पाठ और इनलाइन तत्वों के एक अनियंत्रित अनुभाग को CSS शैली और / या वर्ग (तों) लगाने के लिए उपयोग किया जाता है।


13

<p>टैग एक है paragraph, और इस तरह के रूप में, यह एक है ब्लॉक तत्व (के रूप में उदाहरण के लिए, है, h1और div), जबकि spanएक इनलाइन तत्व है (उदाहरण के लिए के रूप में, bऔर a)

डिफ़ॉल्ट रूप से ब्लॉक तत्व स्वयं के ऊपर और नीचे कुछ व्हाट्सएप बनाते हैं, और उनके बगल में कुछ भी संरेखित नहीं किया जा सकता है, जब तक कि आप floatउन्हें एक विशेषता सेट न करें।

इनलाइन तत्व एक पैराग्राफ के अंदर पाठ के फैलाव से निपटते हैं। उनके पास आमतौर पर कोई मार्जिन नहीं होता है, और इस तरह, आप उदाहरण के लिए, widthइसे सेट नहीं कर सकते हैं ।


हां, स्पैन का कोई मार्जिन नहीं है और इसलिए, यह html मार्कअप का उपयोग करने की क्षमता रखने के लिए टेबल सेल (td) के रूप में अच्छा है
इगोर फोमेंको

6

स्पान पूरी तरह से गैर-शब्दार्थ है। इसका कोई अर्थ नहीं है, और यह केवल कॉस्मेटिक प्रभाव के लिए एक तत्व के रूप में कार्य करता है।

पैराग्राफ का अर्थ अर्थ होता है - वे एक मशीन (जैसे ब्राउज़र या स्क्रीन रीडर) को बताते हैं कि वे जिस सामग्री को एनकैप्सुलेट करते हैं, वह टेक्स्ट का एक ब्लॉक है, और इसका एक ही अर्थ है जैसे किसी पुस्तक में टेक्स्ट का पैराग्राफ।


5

शब्दार्थ, एपी एक पैराग्राफ टैग है और इसका उपयोग टेक्स्ट के पैराग्राफ को प्रारूपित करने के लिए किया जाना चाहिए। एक अवधि एक इनलाइन प्रारूपण परिवर्तन है जिसे शब्दार्थ से नियंत्रित नहीं किया जाता है।


5

स्पैन एक इनलाइन फॉर्मेटिंग तत्व है जिसमें ऊपर या नीचे लाइन फीड नहीं है।

एक पी एक ब्लॉक तत्व है जो ऊपर और नीचे एक निहित रेखा फ़ीड है।

http://w3schools.com/tags/default.asp


4

एक व्यावहारिक स्पष्टीकरण: डिफ़ॉल्ट रूप से, <p> </p>संलग्न पाठ के पहले और बाद में लाइन ब्रेक जोड़ देगा (इसलिए यह एक पैराग्राफ बनाता है)। <span>ऐसा नहीं करता है, इसीलिए इसे इनलाइन कहा जाता है ।


3

पी टैग एक पैरा तत्व को दर्शाता है। उस पर लागू मार्जिन / पैडिंग है। स्पैन एक अनस्टेल्ड इनलाइन टैग है। एक महत्वपूर्ण अंतर यह है कि पी एक ब्लॉक तत्व है जब स्पैन इनलाइन होता है, जिसका अर्थ है कि <p>Hi</p><p>There</p>अलग-अलग लाइनों पर दिखाई देगा जब <span>Hi</span><span>There</span>हवाएं एक तरफ से ऊपर होंगी ।


3

जब हम उस समय <p>सामान्य पाठ का उपयोग कर रहे होते हैं, तो हम <span>टैग चाहते हैं। जब हम सामान्य पाठ का उपयोग कर रहे होते हैं, उस समय हम टैग चाहते हैं


2

<span> एक इनलाइन टैग है, <p> एक ब्लॉक टैग है, जिसका उपयोग पैराग्राफ के लिए किया जाता है। ब्राउजर एक पैराग्राफ के नीचे एक खाली लाइन को रेंडर करेगा, जबकि <span> उसी लाइन पर रेंडर करेगा।


0

टैग एक ब्लॉक-स्तरीय तत्व है, लेकिन टैग इनलाइन तत्व है। आमतौर पर हम ब्लॉक तत्वों के अंदर शैली के लिए स्पैन टैग का उपयोग करते हैं। लेकिन आपको इनलाइन इनलाइन शैली में स्पैन टैग का उपयोग करने की आवश्यकता नहीं है। आपको क्या करना है; "प्रदर्शन: इनलाइन" का उपयोग करके ब्लॉक तत्व को इनलाइन तत्व में बदलें


-6
p {
    float: left;
    margin: 0;
}

कोई रिक्ति आसपास नहीं होगी, यह स्पैन के समान दिखता है।

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