css - why everything gone with display:block? -
यह ठीक है:
& lt; html & gt; & Lt; शीर्ष & gt; & Lt; title & gt; टैब & lt; / title & gt; & LT; शैली & gt; ली {प्रदर्शन: इनलाइन; मार्जिन: 0 90 पीएक्स; पृष्ठभूमि: # 777777 कोई दोहराने नहीं स्क्रॉल करें 0 0; } ली एक {पैडिंग: 6px 12px; रंग: #FFFFFF; text-decoration: कोई नहीं; फोंट की मोटाई: बोल्ड; } & Lt; / style & gt; & Lt; / head & gt; & LT; बॉडी & gt; & Lt; div id = "टैब" & gt; & Lt; div class = "nav" & gt; & LT; ul & gt; & Lt; li & gt; & lt; a href = "test" & gt; परीक्षण & lt; / a & gt; & lt; / li & gt; & Lt; li & gt; & lt; a href = "test" & gt; परीक्षण & lt; / a & gt; & lt; / li & gt; & Lt; li & gt; & lt; a href = "test" & gt; परीक्षण & lt; / a & gt; & lt; / li & gt; & Lt; li & gt; & lt; a href = "test" & gt; परीक्षण & lt; / a & gt; & lt; / li & gt; & Lt; li & gt; & lt; a href = "test" & gt; परीक्षण & lt; / a & gt; & lt; / li & gt; & Lt; / ul & gt; & Lt; / div & gt; & Lt; / div & gt; & Lt; / body & gt; & Lt; / html & gt;
लेकिन अगर मैं li एक
को इसे डिस्प्ले बनाने के लिए बदलता हूं: ब्लॉक
, सब कुछ खत्म हो गया है क्यों?
& lt; html & gt; & Lt; शीर्ष & gt; & Lt; title & gt; टैब & lt; / title & gt; & LT; शैली & gt; ली {प्रदर्शन: इनलाइन; मार्जिन: 0 90 पीएक्स; पृष्ठभूमि: # 777777 कोई दोहराने नहीं स्क्रॉल करें 0 0; } ली एक {पैडिंग: 6px 12px; रंग: #FFFFFF; text-decoration: कोई नहीं; फोंट की मोटाई: बोल्ड; प्रदर्शन क्षेत्र; } & Lt; / style & gt; & Lt; / head & gt; & LT; बॉडी & gt; & Lt; div id = "टैब" & gt; & Lt; div class = "nav" & gt; & LT; ul & gt; & Lt; li & gt; & lt; a href = "test" & gt; परीक्षण & lt; / a & gt; & lt; / li & gt; & Lt; li & gt; & lt; a href = "test" & gt; परीक्षण & lt; / a & gt; & lt; / li & gt; & Lt; li & gt; & lt; a href = "test" & gt; परीक्षण & lt; / a & gt; & lt; / li & gt; & Lt; li & gt; & lt; a href = "test" & gt; परीक्षण & lt; / a & gt; & lt; / li & gt; & Lt; li & gt; & lt; a href = "test" & gt; परीक्षण & lt; / a & gt; & lt; / li & gt; & Lt; / ul & gt; & Lt; / div & gt; & Lt; / div & gt; & Lt; / body & gt; & Lt; / html & gt; संपादित करें : ऐसा लगता है कि पैडिंग: 6 पीएक्स 12 पीएक्स यहां बिल्कुल काम नहीं कर रहा है.लेकिन इसे ली में ले जाने से भी पैडिंग (आईई) में भी नहीं होगा, कैसे ?
आपका कोड गायब हो गया है क्योंकि आपके पास एक इनलाइन के अंदर ब्लॉक तत्व (पंक्ति खंड और ऊंचाई और चौड़ाई के साथ) है तत्व (कोई लाइन ब्रेक और कोई ऊँचाई या चौड़ाई नहीं)
इस पर w3 पेज की समीक्षा करने में मदद मिल सकती है।
ब्लॉक स्तर के तत्वों को अंधेरे के रूप में रूप में स्वरूपित किया जाता है - उनके पास और उसके बाद एक लाइन ब्रेक है।
इनलाइन तत्व सामग्री के नए ब्लॉक का निर्माण नहीं करते हैं वे मूल ब्लॉक स्तर के तत्व के प्रवाह के भीतर हैं।
जब आपके पास एक इनलाइन तत्व में एक ब्लॉक तत्व होता है, गुमनाम बक्से बनाये जाते हैं (देखें पृष्ठ 9.2.1.1 जो मैंने लिंक किया है) और प्रत्येक ब्राउज़र हैंडल उस स्थिति को अलग तरह से।
Comments
Post a Comment