की सीएसएस चौड़ाई मैं अपने मॉड्यूल शीर्षक में <span> टैग का उपयोग करता हूं, उदा।<span> टैग
<span>Categories</span>.
मैं काल की पृष्ठभूमि का रंग/छवि, चौड़ाई और सीएसएस में ऊँचाई निर्दिष्ट।
लेकिन अवधि की चौड़ाई इसकी सामग्री/पाठ पर निर्भर करती है।
तो, अगर मैं <span></span> करता हूं, तो बस एक पृष्ठभूमि छवि/सीएसएस में रंग के साथ, कुछ भी दिखाई नहीं देता है।
बेशक, मुझे कुछ दिखाना है।
मैं इसे कैसे हल कर सकता हूं?
आप स्पष्ट रूप से डिस्प्ले प्रॉपर्टी को "ब्लॉक" पर सेट कर सकते हैं, इसलिए यह ब्लॉक स्तर तत्व की तरह व्यवहार करता है, लेकिन उस स्थिति में आपको शायद इसके बजाय एक div का उपयोग करना चाहिए।
<span style="display:block; background-color:red; width:100px;"></span>
धन्यवाद, मैं देखता हूं। ऐसा इसलिए होता है क्योंकि अवधि इनलाइन है। अब मैं अंतर शर्त देखता हूं। इनलाइन और ब्लॉक प्रदर्शित करता है। हां, div उचित है .: डी .. थैंक्स –
पैराग्राफ के अंदर एक डीआईवी का उपयोग करके, हेडर (एच 1, एच 2 इत्यादि) यदि आप इसकी परवाह करते हैं तो सत्यापन तोड़ देगा। एक और संभावित सोल्शन एक अवधि का उपयोग करना है, प्रदर्शन: ब्लॉक; और फ्लोट: बाएं; :) –
धन्यवाद, और चौड़ाई – Angela
आप प्रदर्शन इनलाइन के साथ तत्व की चौड़ाई निर्दिष्ट नहीं कर सकते हैं। आप इसमें कुछ गैर-ब्रेकिंग स्पेस ( ) जैसे कुछ डाल सकते हैं और फिर इसे और अधिक चौड़ाई देने के लिए पैडिंग सेट कर सकते हैं लेकिन आप इसे सीधे नियंत्रित नहीं कर सकते हैं।
आप प्रदर्शन इनलाइन-ब्लॉक का उपयोग कर सकते हैं लेकिन यह व्यापक रूप से समर्थित नहीं है।
एक वास्तविक हैक एक छवि को अंदर रखना होगा और फिर उस की चौड़ाई निर्धारित करना होगा। एक पारदर्शी 1 पिक्सेल जीआईएफ की तरह कुछ। हालांकि अनुशंसित दृष्टिकोण नहीं है।
इनलाइन शैली में डिफ़ॉल्ट रूप से फैलता है, जिसे आप चौड़ाई निर्दिष्ट नहीं कर सकते हैं।
display: inline-block;
, एक अच्छा तरीका होगा छोड़कर आईई इसका समर्थन नहीं करता
आप कर सकते हैं, हालांकि, hack a multiple browser solution
मेरा मानना है कि आईई कम से कम संस्करण 6 के बाद से इनलाइन-ब्लॉक का समर्थन करता है। मुझे लगता है कि यह केवल इनलाइन-ब्लॉक का समर्थन करता है यदि उसके द्वारा लागू तत्व स्वाभाविक रूप से इनलाइन है (जो है)। –
हाँ, आईई इनलाइन-ब्लॉक का समर्थन करता है। इसका समर्थन काफी अलग है, लेकिन यह इस मामले में काम करेगा। – thomasrutter
बहुत बढ़िया! प्रदर्शन में वास्तविक मतभेदों को समझना शुरू करना: –
उदाहरण के रूप में विशेषता 'प्रदर्शन' का उपयोग करें:
<span style="background: gray; width: 100px; display:block;">hello</span>
<span style="background: gray; width: 200px; display:block;">world</span>
मैं padding विशेषता का उपयोग करूंगा। यह आपको अपनी अवधि गुणों खो तत्व के बिना तत्व के दोनों ओर पिक्सल की एक निर्धारित संख्या को जोड़ने की अनुमति देगा:
यह विधि केवल पैडिंग में जोड़ दी जाएगी, इसलिए यदि आप सामग्री की लंबाई (उदाहरण के लिए श्रेणियों से टैग तक) बदलते हैं, तो सामग्री का आकार बदल जाएगा और तत्व का समग्र आकार भी बदल जाएगा। लेकिन यदि आप वास्तव में एक कठोर आकार निर्धारित करना चाहते हैं, तो आपको उपरोक्त वर्णित करना चाहिए और एक div का उपयोग करना चाहिए।
बॉक्स मॉडल, सामग्री, गद्दी, मार्जिन, आदि
ऊंचाई तय करने के बाद के बारे में अधिक जानकारी के लिए box model देखें और चौड़ाई आपको बता कैसे बाहवे को इसके अंदर पाठ अपने क्षेत्र overflows अगर sholud।तो सीएसएस
अतिप्रवाह में जोड़ें: ऑटो;
अन्य उत्तर में की तरह, आपके अवधि शुरू इस के साथ जिम्मेदार बताते हैं:
padding-left:6%;
padding-right:6%;
आप गद्दी उपयोग करते हैं, अपने रंग के लिए विस्तारित:
display:inline-block;
अब आप चौड़ाई से गद्दी अधिक उपयोग कर सकते हैं दोनों तरफ (दाएं और बाएं), ठीक नहीं (जैसे widht में)।
मैं बस यह इंगित करना चाहता हूं कि यह अवधि का बहुत अच्छा उपयोग नहीं है। इसका मतलब सामग्री की छोटी श्रृंखला को बड़े पैमाने पर चिह्नित करना है, इसलिए यह जानबूझकर डिफ़ॉल्ट रूप से ब्लॉक तत्व नहीं है। शीर्षक के लिए, एच # टैग में से एक सबसे अच्छा होगा। यह विफल होने पर, एक div अभी भी एक अवधि से आमतौर पर बेहतर है। – Chuck
आपके उत्तरों के लिए धन्यवाद ..: डी मुझे यह एक मूर्खतापूर्ण q'n से शुरू करने के लिए मिल रहा है। Lol..so कई साल पहले से ही। =)) –