5 प्रश्नों में समझाया गया सीएसएस फ़्लोट्स
सीएसएस "फ्लोट्स" (फ्लोटिंग तत्व) उपयोग करने में सरल हैं लेकिन एक बार उपयोग करने के बाद, इसके आस-पास के तत्वों पर इसका प्रभाव कभी-कभी अप्रत्याशित हो जाता है। यदि आप कभी भी आस-पास के तत्वों को गायब करने की समस्याओं में आ गए हैं या एक गले में अंगूठे की तरह बाहर निकलते हैं, तो चिंता न करें.
इस पोस्ट में पाँच बुनियादी सवालों को शामिल किया गया है जो आपको तैरते हुए तत्वों के विशेषज्ञ बनने में मदद करेंगे.
- कौन से तत्व तैरते नहीं हैं?
- एक तत्व का क्या होता है जब वह तैरता है?
- "फ्लोट्स" के भाई-बहनों के साथ क्या होता है?
- एक "फ्लोट" के माता-पिता के लिए क्या होता है?
- आप "फ़्लोट्स" को कैसे साफ़ करते हैं?
टीएल को अपनाने वाले पाठकों के लिए, जीवन के लिए डॉ। दृष्टिकोण, पोस्ट के अंत के पास एक सारांश है.
1. कौन से तत्व तैरते नहीं हैं?
एक पूर्ण या तय किया गया तत्व तैरने नहीं जाएगा। तो अगली बार जब आप एक फ़्लोट का सामना कर रहे हैं जो काम नहीं कर रहा है, तो जांचें कि क्या यह अंदर है स्थिति: पूर्ण
या स्थिति: तय
और तदनुसार परिवर्तन लागू करें.
2. जब यह तैरता है तो एक तत्व का क्या होता है?
जब किसी तत्व को "फ्लोट" टैग किया जाता है, तो यह मूल रूप से बाएं या दाएं तक चलता है अपने कंटेनर तत्व की दीवार को हिट करता है. वैकल्पिक रूप से, यह तब तक चलेगा एक और अस्थायी तत्व को हिट करता है जो पहले से ही एक ही दीवार से टकरा चुका है. जब तक स्थान समाप्त नहीं हो जाता, तब तक वे कंधे से कंधा मिलाकर रहेंगे और नए आने वाले लोगों को नीचे ले जाया जाएगा.
फ़्लोटिंग तत्व भी तत्वों से ऊपर नहीं जाएगा से पहले यह कोड में, कोडिंग से पहले आपको जिस पर विचार करने की आवश्यकता है “फ्लोट” बाद एक तत्व जिसकी ओर आप इसे तैरना चाहते हैं.
यहां दो और चीजें हैं जो एक फ्लोटिंग तत्व के साथ होती हैं जो इस बात पर निर्भर करता है कि किस प्रकार के तत्व को फ्लोटिंग रखा जा रहा है:
(1) एक इनलाइन तत्व एक ब्लॉक-स्तरीय तत्व में बदल जाएगा जब मंगाई गई.
कभी आपने सोचा है कि अचानक आप एक फ्लोटिंग को ऊंचाई और चौड़ाई कैसे दे सकते हैं अवधि
? ऐसा इसलिए है क्योंकि फ्लोट होने पर सभी तत्वों को मूल्य मिलेगा खंड
इसके लिए प्रदर्शन
विशेषता (इनलाइन तालिका
लाऊंगा तालिका
) उन्हें ब्लॉक स्तर के तत्व बनाते हैं.
(2) अनिर्दिष्ट चौड़ाई का एक ब्लॉक तत्व तैरने पर इसकी सामग्री को फिट करने के लिए सिकुड़ जाएगा.
आमतौर पर, जब आप किसी ब्लॉक तत्व को चौड़ाई निर्दिष्ट नहीं करते हैं, तो इसकी चौड़ाई डिफ़ॉल्ट 100% होती है। लेकिन जब तैरता है, तो यह मामला नहीं है; जब तक इसकी सामग्री दिखाई नहीं देगी तब तक ब्लॉक एलिमेंट का बॉक्स सिकुड़ जाएगा.
3. "फ्लोट्स" के भाई-बहन के साथ क्या होता है?
जब आप तत्वों के एक समूह के बीच एक तत्व को तैरने का निर्णय लेते हैं, तो यह चिंता न करें कि यह कैसे व्यवहार करने जा रहा है, इसका व्यवहार पूर्वानुमान योग्य होगा और या तो बाएं या दाएं चलेगा। आप वास्तव में क्या सोच रहे होंगे इसके बाद भाई-बहन कैसा व्यवहार करने वाले हैं.
"फ्लोट्स" में पूरी दुनिया में सबसे ज्यादा देखभाल करने वाले और आज्ञाकारी भाई बहन हैं। वे एक अस्थायी तत्व को समायोजित करने के लिए अपनी शक्ति में सब कुछ करेंगे.
पाठ और इनलाइन तत्व बस होगा "फ्लोट्स" के लिए रास्ता बनाएं और "फ्लोट" को घेरेंगे जब यह स्थिति में है.
तत्वों को ब्लॉक करें एक कदम और आगे जाएगा एक "फ्लोट" के आसपास खुद को लपेटो उदारता से, भले ही इसका मतलब "फ्लोट" के लिए जगह बनाने के लिए अपने स्वयं के बाल तत्वों को मारना हो।.
आइए इसे एक प्रयोग में देखें। नीचे एक नीले रंग का बॉक्स है और उसके बाद कुछ बच्चों के तत्वों के साथ एक ही आकार का एक लाल बॉक्स है.
अब, आइए नीले रंग के बॉक्स को तैरते हैं, और देखें कि लाल बॉक्स और उसके बच्चों का क्या होता है.
एक बार जब लाल बॉक्स नीले बॉक्स को गले लगाता है और इसके लिए आप उपयोग कर सकते हैं तो सब कुछ ठीक हो जाएगा छिपा हुआ सैलाब
.
जब आप जोड़ते हैं छिपा हुआ सैलाब
एक तत्व जो फ्लोट को लपेटता है, वह ऐसा करना बंद कर देगा. नीचे देखें कि लाल बॉक्स कैसे व्यवहार करता है छिपा हुआ सैलाब
.
4. एक "फ्लोट" के माता-पिता के लिए क्या होता है?
माता-पिता अपने "फ्लोट" बच्चों के बारे में ज्यादा परवाह नहीं करते हैं, सिवाय इसके कि उन्हें अपने बाएं या दाएं सीमाओं से बाहर नहीं जाना चाहिए.
आमतौर पर अनिर्दिष्ट ऊंचाई का एक ब्लॉक तत्व अपने बाल तत्वों को समायोजित करने के लिए इसकी ऊंचाई बढ़ाता है, लेकिन "फ्लोट" बच्चों के लिए ऐसा नहीं है. यदि "फ्लोट" का आकार बढ़ता है, तो उसके माता-पिता उसके अनुसार इसकी ऊंचाई नहीं बढ़ाएंगे. इसे फिर से उपयोग करके हल किया जा सकता है छिपा हुआ सैलाब
जनक में.
5. "फ़्लोट्स" को कैसे साफ़ करें?
मैंने पहले ही उपयोग करने का उल्लेख किया है छिपा हुआ सैलाब
"फ़्लोट" के बाद अन्य तत्वों के लिए सही स्थान बनाते हुए एक माता-पिता को ऊँचाई-वार करना.
और यह है कि आप कैसे एक तत्व "फ्लोट" के पास रहते हैं जिसमें कोई समझौता नहीं है.
एक और तरीका है जहां तत्व अपने "फ्लोट" भाई-बहनों के पास भी नहीं होंगे। का उपयोग करके स्पष्ट
विशेषता आप एक तत्व को "फ्लोट" के पास होने से मुक्त कर सकते हैं.
स्पष्ट: छोड़ दिया; स्पष्ट: सही; दोनों को साफ करो;
बाएं
मूल्य तत्व के बाईं ओर सभी "फ्लोट्स" को साफ करता है, और इसके लिए इसके विपरीत सही
, और दोनों पक्षों के लिए दोनों
. इस स्पष्ट
विशेषता का उपयोग आपके सुविधाजनक के अनुसार एक सहोदर, खाली डिव या छद्म तत्व पर किया जा सकता है.
सारांश
- पूर्ण / निश्चित तत्व नहीं तैरेंगे.
- एक "फ्लोट" तत्व से ऊपर नहीं जाता है से पहले यह कोड में है.
- यदि कंटेनर में पर्याप्त जगह नहीं है, तो एक "फ्लोट" को नीचे धकेल दिया जाएगा.
- सभी "फ्लोट्स" ब्लॉक-स्तरीय तत्वों में बने होते हैं.
- यदि चौड़ाई "फ्लोट" पर निर्दिष्ट नहीं है, तो यह सामग्री को फिट करने के लिए सिकुड़ जाएगा.
- "फ्लोट" के बाद के भाई-बहन या तो उन्हें (इनलाइन और टेक्स्ट) घेर लेंगे या उन्हें (ब्लॉक) लपेट देंगे.
- एक तत्व को "फ्लोट" लपेटने से रोकने के लिए, उपयोग करें
छिपा हुआ सैलाब
. - एक "फ्लोट" के माता-पिता फ्लोट को फिट करने के लिए इसकी ऊंचाई नहीं बढ़ाएंगे.
- माता-पिता को "फ्लोट" के अनुसार अपनी ऊंचाई बढ़ाने के लिए उपयोग करें
छिपा हुआ सैलाब
(या के साथ एक खाली भाई बनाएँस्पष्ट
इसके बाद) - किसी भी "फ्लोट" के पास होने वाले तत्व को रोकने के लिए उपयोग करें
स्पष्ट
गुण.