CSS ماکس بلوک سائز فتحی

صفحه قبلی mask-type
صفحه بعدی max-height

تعریف و استفاده

max-block-size ویژگی‌ها اندازه حداکثر عنصر در مسیر بلوک را مشخص می‌کنند.

اگر اندازه محتوا در مسیر بلوک کوچکتر از مقدار حداکثر باشد، max-block-size مقدار ویژگی مؤثر نیست.

اگر اندازه محتوا در مسیر بلوک بزرگتر از مقدار حداکثر باشد، max-block-size مقدار ویژگی.

توجه داشته باشید:ویژگی‌های CSS مرتبط writing-mode مسیر بلوک را تعریف می‌کند که بر روی max-block-size ویژگی‌ها نتایج ویژگی‌های CSS را تأثیر می‌گذارند. برای صفحات انگلیسی، مسیر بلوک به سمت پایین و مسیر خطی از چپ به راست است.

CSS max-block-size ویژگی‌ها با ویژگی‌های CSS max-height و max-width بسیار مشابه، اما max-block-size ویژگی به مسیر بلوک وابسته است.

مثال

مثال 1

بزرگترین اندازه ممکن برای عنصر <div> را به 60 پیکسل تنظیم کنید:

div {
  max-block-size: 60px;
}

آزمایش کنید

مثال 2: روش نوشتاری

عنصر <div> را تنظیم کنید writing-mode مقدار ویژگی به vertical-lr تنظیم شود، مسیر بلوک از به سمت پایین به جانبی تغییر می‌کند که این بر روی max-block-size روش کار ویژگی:

div {
  max-block-size: 60px;
  writing-mode: vertical-lr;
}

آزمایش کنید

مثال 3: Max-block-size vs Block-size

یک عنصر <div> را مشاهده کنید (block-size و یک عنصر <div> دیگر (max-block-size واکنش‌های مختلف در تغییر اندازه محتوا برای 100px (

#div1 {
  max-block-size: 100px;
}
#div2 {
  block-size: 100px;
}

آزمایش کنید

آموزش زبان CSS

max-block-size: auto|طول|مقدار پیش‌فرض|وارث;

مقدار ویژگی

مقدار	توضیح
자동	پیش‌فرض. مقدار پیش‌فرض max-block-size عنصر.
طول	مقدار max-block-size را مشخص کنید، واحد‌های آن px، pt، cm و غیره هستند. ببینید:سی ایس ایس یونٹ.
%	اندازه‌ای که در محور مربوط به عنصر والد مشخص شده است را به عنوان درصد max-block-size مشخص کنید.
مقدار پیش‌فرض	این ویژگی را به مقدار پیش‌فرض خود تنظیم کنید. ببینید: مقدار پیش‌فرض.
وارث	این ویژگی را از عنصر والد خود ارث می‌برد. ببینید: وارث.

جزئیات فنی

مقدار پیش‌فرض:	자동
وارثی:	خیر
انیمیشن‌سازی:	پشتیبانی شده است. لطفاً به:ویژگی‌های مرتبط با انیمیشن.
نسخه:	CSS3
آموزش زبان جاوااسکریپت:	object.style.maxBlockSize="60px"