2012-01-19 7 views
43

bootstrap.css मेंbootstrap.css: .container: प्रदर्शन तालिका से पहले

आप इसका उपयोग क्यों करता है या तो Github से या http://twitter.github.com/bootstrap/#

से पा सकते हैं:

.container:before, .container:after { 
    display: table; 
    content: ""; 
    zoom: 1; 
    } 

    .row:before, .row:after { 
    display: table; 
    content: ""; 
    zoom: 1; 
    } 

क्यों परिभाषित प्रदर्शन: तालिका में .container: पहले/बाद और .row: पहले/बाद में?

उत्तर

56

http://nicolasgallagher.com/micro-clearfix-hack/

clearfix हैक एक लोकप्रिय तरीका प्रदर्शनकारी मार्कअप का उपयोग करने के सहारा के बिना तैरता को रोकने के लिए है। यह आलेख स्पष्ट फ़िक्स विधि के लिए एक अद्यतन प्रस्तुत करता है जो आगे आवश्यक सीएसएस की मात्रा को कम करता है।

http://html5boilerplate.com/docs/The-style/#clearfix:

एक तत्व को .clearfix जोड़ने से यह सुनिश्चित होगा कि यह हमेशा पूरी तरह से इसके जारी बच्चों में शामिल है। पिछले कुछ वर्षों में क्लियरफिक्स हैक के कई प्रकार हैं, और अन्य हैक्स भी हैं जो आपको फ़्लोट किए गए बच्चों को रखने में सहायता कर सकते हैं, लेकिन एच 5 बीपी वर्तमान में इस माइक्रो क्लियरफिक्स सहायक वर्ग प्रदान करता है।

  • .clearfix:before, .clearfix:after { content: ""; display: table; }
    यह नियम IE6/7 के अलावा सभी ब्राउज़रों द्वारा समझा जाता है। में तत्वों की सामग्री से पहले और उसके बाद एक छद्म-तत्व उत्पन्न करता है। display: table सेट करना एक अज्ञात table-cell और एक नया ब्लॉक प्रारूपण संदर्भ बनाता है। यह शीर्ष-मार्जिन पतन को रोकने और आधुनिक ब्राउज़र और आईई 6/7 के बीच स्थिरता में सुधार करने के लिए कार्य करता है।

  • .clearfix:after { clear: both; }
    :after छद्म तत्व इस तत्व की शुरु बच्चों स्पष्ट, जिससे तत्व तैरता शामिल करने के लिए विस्तार कर रही है बनाता है।

  • .clearfix { zoom: 1; }
    IE6/7 में नए ब्लॉक स्वरूपण संदर्भ बनाएं hasLayout

ट्रिगर द्वारा
संबंधित मुद्दे