CSS ब्लॉक-साइज़ अट्रिब्यूट

वर्णन और उपयोग

block-size गुण एलीमेंट को ब्लॉक दिशा पर आयाम निर्दिष्ट करता है。

ध्यान दें:संबंधित CSS गुण writing-mode ब्लॉक दिशा को परिभाषित करता है, जो block-size गुण के परिणाम के रूप में

CSS के block-size और inline-size गुण CSS के width और height गुण बहुत अधिक समान हैं, लेकिन block-size और inline-size गुण ब्लॉक दिशा और आइनलाइन दिशा पर निर्भर करता है。

उदाहरण

उदाहरण 1

<div> एलीमेंट को ब्लॉक दिशा पर आयाम सेट करें:

div {
  block-size: 200px;
}

अपने आप प्रयोग करें

उदाहरण 2

जब <div> एलीमेंट का writing-mode प्रयोग vertical-rl के रूप में सेट किया जाता है, तो ब्लॉक दिशा अधिकता से अभिमुखी होकर पारस्परिक रूप से बदलती है, जो block-size प्रयोग के कार्य दिशा को प्रभावित करती है:

div {
  block-size: 250px;
  writing-mode: vertical-rl;
}

अपने आप प्रयोग करें

CSS व्याकरण

inset-block: auto|length|initial|inherit;

गुण मूल्य

मूल्य वर्णन
auto मूलभूत
length block-size को px, pt, cm आदि इकाइयों में निर्दिष्ट करें।अन्य संदर्भ देखें:सीएसएस इकाई
% block-size को पिता एलीमेंट के बाहरी आयाम पर संबंधित अक्ष पर प्रतिशत में निर्दिष्ट करें。
initial इस गुण को उसके मूलभूत मूल्य पर सेट करें।देखें initial
inherit इस गुण को उसके पिता एलीमेंट से विरासत करें।देखें inherit

तकनीकी विवरण

मूलभूत मूल्य: auto
विरासतीयता: नहीं
एनीमेशन निर्माण: समर्थित।देखें:एनीमेशन संबंधी गुण
संस्करण: CSS3
JavaScript व्याकरण: object.style.blockSize="100px"

ब्राउज़र अभियोग्यता

तालिका में दिए गए नंबर इस अभियोग्यता को प्रथम पूरी तरह से समर्थन देने वाले ब्राउज़र का संस्करण के रूप में प्रस्तुत करते हैं。

Chrome Edge Firefox Safari Opera
57.0 79.0 41.0 12.1 44.0

संबंधित पृष्ठ

CSS शिक्षा:CSS ऊंचाई और चौड़ाई

CSS शिक्षा:CSS फ़्रेम-मॉडेल

CSS संदर्भ:height प्रयोग

CSS संदर्भ:width प्रयोग

CSS संदर्भ:writing-mode प्रयोग