Sifat break-after CSS

Definisi dan penggunaan

Sifat break-after menentukan sama ada halaman, baris atau kawasan harus diputuskan selepas elemen yang ditentukan.

Sifat break-after meluaskan sifat page-break-after dalam CSS2.

Dengan menggunakan break-after, anda boleh memberitahu pelayar untuk memutuskan halaman, baris atau kawasan selepas elemen yang mempunyai sifat break-after, atau mengelakkan elemen untuk disahut ke dua halaman.

Contoh

Selalu letakkan penanda halaman di belakang elemen <footer>:

@media print {
  footer {
    break-after: always;
  }
}

Syntaks CSS

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

Nilai atribut

Nilai Deskripsi
auto Default. Halaman, kolom, dan pemisahan otomatis di belakang elemen.
all Selalu letakkan penanda halaman segera setelah kotak utama.
always Selalu letakkan penanda halaman di belakang elemen.
avoid Jiwa untuk menghindari gangguan halaman, kolom, dan kawasan di belakang elemen.
avoid-column Jiwa untuk menghindari pemformatan kolom di belakang elemen.
avoid-page Jiwa untuk menghindari pemformatan halaman di belakang elemen.
avoid-region Jiwa untuk menghindari pemisahan di belakang elemen.
column Selalu letakkan penanda kolom di belakang elemen.
left Letakkan satu atau dua penanda halaman di belakang elemen untuk memformat halaman berikutnya menjadi halaman kiri.
page Selalu letakkan penanda halaman di belakang elemen.
recto Letakkan satu atau dua penanda halaman di belakang kotak utama untuk memformat halaman berikutnya menjadi halaman recto.
region Selalu letakkan penanda pemisah di belakang elemen.
right Letakkan satu atau dua penanda halaman di belakang elemen untuk memformat halaman berikutnya menjadi halaman kanan.
verso Letakkan satu atau dua penanda halaman di belakang kotak utama untuk memformat halaman berikutnya menjadi halaman verso.
initial Tetapkan atribut ini ke nilai default. Lihat initial
inherit Mewarisi atribut ini dari elemen induk. Lihat inherit

Detil teknis

Nilai default: auto
Mewarisi: Tidak
Pembuatan animasi: Tidak didukung. Lihat:Atribut berhubungan dengan animasi
Versi: CSS3
Syntaxa JavaScript: object.style.breakAfter="always"

Banyak contoh lain

Contoh

Selalu letakkan penanda halaman di belakang elemen dengan id 'toc':

@media print {
  #toc {
    break-after: always;
  }
}

Contoh

Selalu letakkan penanda pemisah di belakang elemen <ul> di dalam kawasan tertentu:

.region ul {
    break-after: region;
  }
}

Dukungan perekam

Angka di dalam tabel menunjukkan versi paling awal browser yang mendukung atribut ini penuh.

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