CSS بریک-اینسائیڈ کیمپٹ

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

ویژگی 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