CSS bottom गुण
- पिछला पृष्ठ border-width
- अगला पृष्ठ box-decoration-break
परिभाषा और उपयोग
bottom अभियान एलिमेंट के बोटम किनारे को निर्दिष्ट करता है। यह अभियान निर्देशकरण एलिमेंट के निचले पैडिंग की सीमा को उसके इकाई बॉक्स के निचले सीमा से अलगाता है。
टिप्पणी:यदि "position" अभियान का मान "static" है, तो "bottom" अभियान को सेट करने से कोई प्रभाव नहीं पड़ेगा。
वर्णन
स्थिर एलिमेंट के लिए auto होगा; लंबाई मान के लिए संबंधित निर्दिष्ट लंबाई होगी; प्रतिशत मान के लिए निर्दिष्ट मान होगा; अन्यथा auto होगा。
सापेक्षिक वर्गीकृत एलिमेंट के लिए अगर bottom और top दोनों auto हैं, तो उनके गणनात्मक मान दोनों 0 होंगे; अगर एक मात्र auto है, तो दूसरे मान का विपरीत लिया जाएगा; अगर दोनों नहीं auto हैं, तो bottom top के मान का विपरीत लिया जाएगा。
और देखें:
CSS पाठ्यक्रमCSS स्थानीकरण
HTML DOM संदर्भbottom अभियान
उदाहरण
इमेज के निचले किनारे को उसके इकाई एलिमेंट के बोटम किनारे से 5 पिक्सल ऊपर के स्थान पर सेट करें:
img { position:absolute; bottom:5px; }
CSS व्याकरण
bottom: auto|length|initial|inherit;
प्रयोग
मूल्य | वर्णन |
---|---|
auto | डिफ़ॉल्ट मूल्य। ब्राउज़र द्वारा बोटम के स्थान की गणना की जाती है。 |
% | एलिमेंट के बोटम स्थान को इकाइयों के प्रतिशत मान से सेट करें। नकारात्मक मान का उपयोग कर सकते हैं。 |
length | एलिमेंट के बोटम स्थान को पिक्सल, सेमी, सेंटीमीटर आदि इकाइयों से सेट करें। नकारात्मक मान का उपयोग कर सकते हैं。 |
inherit | पिछले एलिमेंट के बोटम पैडिंग के मान को विरासत करना होगा。 |
तकनीकी विवरण
डिफ़ॉल्ट मूल्य: | auto |
---|---|
विरासतीयता: | no |
संस्करण: | CSS2 |
JavaScript व्याकरण: | object.style.bottom="50px" |
अधिक उदाहरण
- पिक्सल मान के द्वारा इमेज के निचले किनारे को सेट करना
- इस उदाहरण में देखा जाता है कि कैसे पिक्सल मान के द्वारा इमेज के निचले किनारे को सेट किया जाता है。
- प्रतिशत मान के द्वारा इमेज के निचले किनारे को सेट करना
- इस उदाहरण में देखा जाता है कि कैसे प्रतिशत मान के द्वारा इमेज के निचले किनारे को सेट किया जाता है。
ब्राउज़र समर्थन
तालिका में दिए गए नंबरों से पूर्णता से समर्थित पहले ब्राउज़र का संस्करण का पता चलता है。
च्रोम | IE / एज | फायरफॉक्स | सैफारी | ओपेरा |
---|---|---|---|---|
1.0 | 5.0 | 1.0 | 1.0 | 6.0 |
- पिछला पृष्ठ border-width
- अगला पृष्ठ box-decoration-break