Sifat break-inside CSS

Definisi dan penggunaan

Atribut break-inside menentukan sama ada halaman, baris, atau kawasan akan terjadi di dalam elemen yang ditentukan.

Atribut break-inside meluaskan atribut page-break-inside daripada CSS2.

Dengan menggunakan break-inside, anda boleh memberitahu pereka untuk menghindari gangguan di dalam imej, kod kecil, tabel, dan senarai.

Contoh

Avoid halaman di dalam elemen <img>:

@media print {
  img {
    display: block;
    break-inside: avoid;
  }
}

Bentuk Bahasa CSS

break-inside: auto|all|always|avoid|avoid-column|avoid-page|avoid-region|column|left|page|recto|region|right|verso|initial|inherit;

Nilai atribut

Value Description
auto Lalai. Halaman, baris, dan kawasan di dalam elemen akan dihaluskan secara automatik.
avoid Avoid halaman, baris, atau kawasan di dalam elemen.
avoid-column Avoid halaman di dalam elemen.
avoid-page Avoid halaman di dalam elemen.
avoid-region Avoid halaman di dalam elemen.
initial Tetapkan sifat ini ke nilai lalainya. Lihat initial。
inherit Mewarisi sifat ini dari elemen bapanya. Lihat inherit。

Perincian teknologi

Nilai lalai: auto
Warisan: Tidak
Pembuatan animasi: Tidak disokong. Lihat:Atribut berkaitan animasi。
Versi: CSS3
Bentuk Bahasa JavaScript: object.style.breakInside="always"

Contoh lanjut

Avoid halaman di dalam elemen <table>、<ul>、<ol>:

@media print {
  table, ul, ol {
    break-inside: avoid;
  }
}

Pembiayaan pereka

Nombor di dalam tabel menunjukkan versi pereka paling awal yang menyokong sifat ini.

Chrome IE / Edge Firefox Safari Opera
50.0 10.0 65.0 10.0 37.0