@page

Baseline 2024 *
Newly available

Since December 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

* Some parts of this feature may have varying levels of support.

Resumen

La regla @page es usada para modificar algunas propiedades CSS cuando se va a imprimir una página web. No se pueden cambiar todas las propiedades CSS con @page, solo los márgenes, las líneas viudas, huérfanas y los saltos de página. Cualquier intento de cambiar otra propiedad será ignorada.

La regla @page puede ser accesada por medio de la interfaz modelo objeto CSSPageRule.

Nota: La W3C esta discutiendo como manejar las unidades relativas <length> : vh, vw, vmin, y vmax. Mientras tanto, se recomienda no usarlas en la regla @page.

Sintaxis

Descriptores

size

Especifica el tamaño y la orientación de la caja objetivo de la página. En general, una caja es representada dentro de una hoja, también indica el tamaño de la hoja destino.

marks

Añade marcas de corte y/o registro al documento.

bleed

Especifica la extensión más allá de la caja de página a la que se recorta el procesamiento de página.

Sintaxis Formal

@page = 
@page <page-selector-list>? { <declaration-rule-list> }

<page-selector-list> =
<page-selector>#

<page-selector> =
[ <ident-token>? <pseudo-page>* ]!

<pseudo-page> =
':' [ left | right | first | blank ]

Ejemplos

Por favor dirígete a las pseudo-classes de @page por ejemplos.

Especificaciones

Specification
CSS Paged Media Module Level 3
# at-page-rule
CSS Logical Properties and Values Level 1
# page

Compatibilidad con navegadores

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
@page
@bottom-center page-margin box
Experimental
@bottom-left page-margin box
Experimental
@bottom-left-corner page-margin box
Experimental
@bottom-right page-margin box
Experimental
@bottom-right-corner page-margin box
Experimental
@left-bottom page-margin box
Experimental
@left-middle page-margin box
Experimental
@left-top page-margin box
Experimental
page-orientation descriptor
@right-bottom page-margin box
Experimental
@right-middle page-margin box
Experimental
@right-top page-margin box
Experimental
size descriptor
jis-b4 page size
jis-b5 page size
@top-center page-margin box
Experimental
@top-left page-margin box
Experimental
@top-left-corner page-margin box
Experimental
@top-right page-margin box
Experimental
@top-right-corner page-margin box
Experimental

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
No support
No support
Experimental. Expect behavior to change in the future.
See implementation notes.