CSS بریک-اینسائیڈ کیمپٹ
- پیشین پیچ break-before
- پایانگلائی caption-side
تعریف و استفاده
ویژگی break-inside تعیین میکند که آیا در داخل عناصر مشخص شده باید صفحات (page-break)، ستونها (column-break) یا مناطق (region-break) رخ دهد یا خیر.
ویژگی break-inside از ویژگی page-break-inside در CSS2 گسترش یافته است.
با استفاده از break-inside، میتوانید به مرورگر اطلاع دهید که در داخل تصاویر، بخشهای کد، جدولها و لیستها از وقفهها جلوگیری شود.
مثال
جلوگیری از صفحات در داخل عناصر <img>:
@media print { img { display: block; break-inside: avoid; } }
نوع CSS
break-inside: auto|all|always|avoid|avoid-column|avoid-page|avoid-region|column|left|page|recto|region|right|verso|initial|inherit;
مقدار ویژگی
مقدار | توضیحات |
---|---|
auto | پیشفرض. صفحات، ستونها، و مناطق در داخل عناصر به صورت خودکار تقسیم میشوند. |
avoid | جلوگیری از وقفههای صفحه، ستون، و منطقه در داخل عناصر. |
avoid-column | جلوگیری از تقسیمبندی ستونها در داخل عناصر. |
avoid-page | جلوگیری از صفحات در داخل عناصر. |
avoid-region | جلوگیری از تقسیمبندی در داخل عناصر. |
initial | این ویژگی را به مقدار پیشفرض خود تنظیم کنید. به لطفاً مراجعه کنید: initial。 |
inherit | از پدر عناصر این ویژگی را ارث میبرد. به لطفاً مراجعه کنید: inherit。 |
جزئیات فنی
مقدار پیشفرض: | auto |
---|---|
وراثت: | خیر |
انیمیشنسازی: | پشتیبانی نمیشود. به لطفاً مراجعه کنید:ویژگیهای مرتبط با انیمیشن。 |
نسخه: | CSS3 |
نوع جاوااسکریپت: | object.style.breakInside="always" |
مثالهای بیشتر
جلوگیری از صفحات در داخل عناصر <table>،<ul>،<ol>:
@media print { table, ul, ol { break-inside: avoid; } }
پشتیبانی مرورگر
اعداد در جدول نشاندهنده نسخه اولین مرورگر هستند که این ویژگی را کاملاً پشتیبانی میکند.
چروم | آئی ای / ایج | فائرفاکس | سافری | اوپرا |
---|---|---|---|---|
50.0 | 10.0 | 65.0 | 10.0 | 37.0 |
- پیشین پیچ break-before
- پایانگلائی caption-side