Properti break-after CSS

Definisi dan penggunaan

Atribut break-after menentukan apakah halaman, kolom, atau area harus terjadi setelah elemen yang ditentukan.

Atribut break-after memperluas atribut page-break-after CSS2.

Dengan menggunakan break-after, Anda dapat memberitahu peramban untuk memutuskan halaman, kolom, atau area setelah elemen yang mempunyai atribut break-after, atau menghindari pemisahan elemen dan melewati dua halaman.

Contoh

Selalu masukkan simbol halaman sebelum elemen <footer>.

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

Bentuk sintaksis 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 Standar. Otomatis melakukan pemformatan halaman, kolom, dan pemisahan setelah elemen.
all Selalu masukkan simbol halaman setelah kotak utama segera.
always Selalu masukkan simbol halaman setelah elemen.
avoid hindari gangguan halaman, kolom, dan area setelah elemen.
avoid-column hindari pemformatan kolom setelah elemen.
avoid-page hindari pemformatan halaman setelah elemen.
avoid-region hindari pemisahan setelah elemen.
column Selalu masukkan simbol kolom setelah elemen.
left Masukkan satu atau dua simbol halaman setelah elemen untuk mengformat halaman berikutnya menjadi halaman kiri.
page Selalu masukkan simbol halaman setelah elemen.
recto Masukkan satu atau dua simbol halaman setelah kotak utama untuk mengformat halaman berikutnya menjadi halaman recto.
region Selalu masukkan simbol pemisah setelah elemen.
right Masukkan satu atau dua simbol halaman setelah elemen untuk mengformat halaman berikutnya menjadi halaman kanan.
verso Masukkan satu atau dua simbol halaman setelah kotak utama untuk mengformat halaman berikutnya menjadi halaman verso.
initial Atur atribut ini ke nilai standarnya. Lihat initial。
inherit Mengambil atribut ini dari elemen induknya. Lihat inherit。

Detil teknis

Nilai standar: auto
Turunan: Tidak
Pembuatan animasi: Tidak didukung. Lihat:Atribut berhubungan dengan animasi。
Versi: CSS3
Bentuk sintaksis JavaScript: object.style.breakAfter="always"

Lebih banyak contoh

Contoh

Selalu masukkan simbol halaman setelah elemen dengan id "toc":

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

Contoh

Selalu masukkan simbol pemisah setelah elemen <ul> di dalam area tertentu:

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

Dukungan browser

Angka di tabel menunjukkan versi browser pertama yang mendukung atribut ini penuh.

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