क्या फ्लोट के बीच कोई अंतर है: कोई नहीं और स्पष्ट: कोई भी

Question

मैं फ्लोट और स्पष्ट का उपयोग करके कुछ सामान कर रहा था। मुझे float: none; या clear: none; का उपयोग करके कोई फर्क नहीं पड़ता है क्या कोई है? क्या कोई उदाहरण

Answer 1

Float:none; उन तत्वों को बताता है जिन्हें आप फ़्लोट करने की इच्छा नहीं रखते हैं।

Clear अन्य तत्व बताता है कि उन्हें तैरने की अनुमति दी जानी चाहिए या नहीं, और किसी के मामले में, आप दोनों तरफ तैरने की अनुमति नहीं दे रहे हैं। यही कारण है कि जब आप clear:both; का उपयोग करते हैं जो फ़्लोटिंग स्टॉप करता है।

Answer 2

वे दो पूरी तरह से अलग चीजें हैं।

float एक तत्व अपने माता-पिता के अंदर बाएं या दाएं (पैरामीटर) को संरेखित करेगा। float: none कुछ भी नहीं करता है, जब तक कि तत्व पहले से ही फ़्लोट नहीं कर रहा था। फ्लोट तत्व इसे स्वचालित रूप से भरने वाली चौड़ाई खो देता है, और इसे जितना छोटा हो सकता है उतना छोटा कर देता है।

clear यह सुनिश्चित करेगा कि आपके द्वारा बताए गए तरफ कोई फ़्लोटिंग तत्व नहीं है। यदि कोई है, तो यह तब तक नीचे चलेगा जब तक कि दिशा में कोई भी नहीं है। clear: both दोनों दिशाओं के लिए यह जांच करेगा।

आपको यह दिखाने के लिए एक उदाहरण दिया गया है कि floats और clears क्या करें।

Answer 3

फ्लोट कोई भी आसन्न चल बच्चे तत्वों के आसपास wraping को रोकने के लिए एक तत्व बंद हो जाता है। डिफ़ॉल्ट रूप से, तत्वों ने कोई भी फ्लोट नहीं किया है। किसी भी फ़्लोटिंग बच्चे को बाएं या दाएं तरफ से लपेटने के लिए दोनों स्टॉप तत्व साफ़ करें। अधिक जानकारी और लाइव उदाहरणों के लिए, मेरे ट्यूटोरियल पर जाएं, http://tutorial.techaltum.com/css_float.html।

Answer 4

ऐसा लगता है कि आपको float क्या अंतर्निहित अवधारणा को समझ में नहीं आया है। float का कोई मान none को छोड़कर जब भी ब्लॉक-स्तर तत्व को असाइन किया जाता है, उस तत्व को दस्तावेज़ प्रवाह से बाहर ले जाता है। मान लें कि आपके पास दो अलग-अलग div तत्व हैं, एक float:none और दूसरा clear:none के साथ। अब बाद में में दस्तावेज़ प्रवाह के प्रवाह के के प्रवाह प्रवाह के आधार पर हो सकता है - इसके फ्लोट वैल्यू के आधार पर। मैं आपको दो उदाहरण प्रस्तुत करता हूं।पहले संस्करण में लाल पैरा float:none उपयोग करता है और दूसरे संस्करण में लाल पैरा clear: none

लाल पैरा float:none का उपयोग कर का उपयोग करता है:

#usefloatnone 
 
{ 
 
    border: 1px dotted black; 
 
    background-color: red; 
 
    width: 1050px; height: 350px; 
 
    
 
    float: none; 
 
} 
 

 
#useclearnone 
 
{ 
 
    border: 1px dotted black; 
 
    background-color: red; 
 
    width: 1050px; height: 200px; 
 
    float: right; 
 
    
 
    clear: none; 
 
} 
 

 
#normal 
 
{ 
 
    border: 1px dotted black; 
 
    width: 1050px; height: 100px; 
 
}

</style> 
 

 
    </head> 
 
    <p id="usefloatnone"> Red paragraph </p> 
 
    <p id="normal"> Normal paragraph </p> 
 
    <p id="normal"> Normal paragraph </p> 
 
    <p id="normal"> Normal paragraph </p> 
 
</html>

लाल पैरा clear:none का उपयोग कर:

#usefloatnone 
 
{ 
 
    border: 1px dotted black; 
 
    background-color: red; 
 
    width: 1050px; height: 350px; 
 
    
 
    float: none; 
 
} 
 

 
#useclearnone 
 
{ 
 
    border: 1px dotted black; 
 
    background-color: red; 
 
    width: 1050px; height: 200px; 
 
    float: right; 
 
    
 
    clear: none; 
 
} 
 

 
#normal 
 
{ 
 
    border: 1px dotted black; 
 
    width: 1050px; height: 100px; 
 
}

<p id="useclearnone"> Red paragraph </p> 
 
    <p id="normal"> Normal paragraph </p> 
 
    <p id="normal"> Normal paragraph </p> 
 
    <p id="normal"> Normal paragraph </p>

आप जबकि अब clear: none और float: none का उपयोग कर प्रभाव में अंतर देख सकते हैं। मेरा सुझाव है कि आप पहले float और clearfrom this tutorial by w3.org community की अवधारणा को पूरी तरह से समझें। आप तत्वों पर clear संपत्ति का उपयोग करते हैं जब आप किसी भी फ़्लोटिंग तत्वों को साफ़ करना चाहते हैं/(आमतौर पर बाएं या दाएं)।