HTML <span> . का उपयोग करना सीखें तत्व।
एचटीएमएल <span> तत्व एक सामान्य इनलाइन कंटेनर तत्व है, जिसका उपयोग टेक्स्ट को चिह्नित करने के लिए किया जाता है। इसे अक्सर किसी अन्य तत्व के अंदर प्रयोग किया जाता है।
<span> अक्सर किसी पाठ के भाग को बाकियों से अलग दिखाने के लिए उपयोग किया जाता है।
उदाहरण:
<p>My hat is <span style="color:red">red.</span></p>
आप <span> . का भी उपयोग कर सकते हैं एक class . के माध्यम से समान स्टाइल विशेषता मान साझा करने वाले तत्वों को समूहित करने के लिए ।
उदाहरण के लिए, मान लें कि आप रेसिपी लिख रहे हैं, और आप अपने टेक्स्ट ब्लॉक के प्रत्येक शब्द पर ज़ोर देना चाहते हैं जो एक विशिष्ट रंग के साथ एक घटक-शब्द है:
<p>
To make my delicious garlic butter you need just four ingredients,
<span class="ingredient">butter</span>,
<span class="ingredient">garlic</span>,
<span class="ingredient">salt</span> and
<span class="ingredient">black pepper.</span>
</p>फिर आप CSS क्लास इस तरह बना सकते हैं:
.ingredient {
color: green;
}
पुन:प्रयोज्य वर्ग का उपयोग करने के बारे में स्मार्ट बात यह है कि यदि आप किसी बिंदु पर अपना विचार बदलते हैं कि घटक शब्दों को कैसे दिखना चाहिए, तो आप बस एक बार इसकी शैली बदल सकते हैं .ingredient वर्ग, और प्रभाव हर <span> . पर होगा तत्व जो इस वर्ग का उपयोग करता है।
उदाहरण के लिए, मान लें कि आप सामग्री पर ज़ोर देने के लिए रंग के बजाय बोल्ड फ़ॉन्ट का उपयोग करना चाहते हैं:
.ingredient {
font-weight: bold;
}
<span> तत्व की सामान्य प्रकृति, इसे एक अ-अर्थपूर्ण . बनाती है तत्व। इसलिए इस तत्व का उपयोग केवल तभी किया जाना चाहिए जब कोई अन्य तत्व न हो जो उपयोग करने के लिए अधिक समझ में आता हो।
<span> तत्व <div> . के समान है , तत्व, लेकिन मुख्य अंतर यह है कि डिफ़ॉल्ट रूप से, <span> एक इनलाइन तत्व है, और <block> ब्लॉक स्तर का तत्व है। हालांकि आप सीएसएस के साथ तत्वों की डिफ़ॉल्ट स्टाइलिंग को ओवरराइड कर सकते हैं।