La propiedad Style pageBreakInside se usa para configurar o devolver el comportamiento de salto de página dentro de un elemento en la impresión o vista previa de impresión. La propiedad Style pageBreakInside no afecta a los elementos absolutamente posicionados.
Sintaxis:
- Para obtener la propiedad:
object.style.pageBreakInside
- Para establecer la propiedad:
object.style.pageBreakInside = "auto|avoid|initial|inherit"
Nota: en lugar de esta propiedad, use la propiedad de interrupción porque se reemplaza con la propiedad de interrupción
Valores devueltos: Devuelve un valor de string, que representa el comportamiento de salto de página dentro de un elemento al imprimir
Valores de propiedad :
- auto: Se utiliza para insertar un salto de página dentro del elemento si es necesario.
- evitar: Se utiliza para evitar un salto de página dentro de un elemento.
- initial : se utiliza para establecer esta propiedad en su valor predeterminado.
- heredar: se utiliza para heredar esta propiedad de su elemento padre.
El siguiente programa ilustra la propiedad Style pageBreakInside:
Ejemplo: Evitar un salto de página dentro del elemento <p> con id=”footer”
html
<!DOCTYPE html>
<html>
<head>
<title>Style pageBreakInside Property in HTML</title>
<style>
h1 {
color: green;
}
h2 {
font-family: Impact;
}
body {
text-align: center;
}
</style>
</head>
<body>
<h1>GeeksforGeeks</h1>
<h2>Style pageBreakInside Property</h2>
<br>
<p id="myfooter">Geeksforgeeks is a portal for geeks.</p>
<p>For avoiding page break inside footer paragraph,
double click the "Avoid Page Break" button: </p>
<br>
<button ondblclick="pagebreak()">Avoid Page Break</button>
<script>
function pagebreak() {
document.getElementById("myfooter")
.style.pageBreakInside = "avoid";
}
</script>
</body>
</html>
Producción:
- Antes de hacer clic en el botón:
- Después de hacer clic en el botón:
Nota: Para ver el resultado, guarde el código en un archivo HTML y ejecútelo en su navegador. La salida se verá cuando vea la VISTA PREVIA DE IMPRESIÓN de ese archivo.
Navegadores compatibles: El navegador compatible con HTML DOM | Las propiedades de estilo pageBreakInside se enumeran a continuación:
- Google Chrome 1 y superior
- Borde 12 y superior
- Internet Explorer 8 y superior
- Firefox 19 y superior
- Ópera 7 y superior
- Apple Safari 1.3 y superior
Publicación traducida automáticamente
Artículo escrito por Shubrodeep Banerjee y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA