Deshabilitar las opciones de impresión del navegador (encabezados, pies de página, márgenes) de la página?
He visto esta pregunta hecha de un par de maneras diferentes en SO y varios otros sitios web, pero la mayoría de ellos son demasiado específicos o desactualizados. Espero que alguien pueda dar una respuesta definitiva sin complacer a la especulación.
¿Hay alguna forma, ya sea con CSS o javascript, de cambiar la configuración predeterminada de la impresora cuando alguien imprime dentro de su navegador? Y por supuesto por "imprime desde su navegador" me refiero a alguna forma de HTML, no PDF o algún otro plug-in tipo reliant mime.
Tenga en cuenta:
Si algunos navegadores ofrecen esto y otros no (o si solo sabes cómo hacerlo para algunos navegadores), doy la bienvenida a las soluciones específicas del navegador.
Del mismo modo, si usted sabe de un navegador convencional que tiene restricciones específicas en contra de hacer esto, que también es útil, pero alguna documentación bastante actualizada sería apreciada. (simplemente decir "eso va en contra de la política de seguridad de XYZ" no es muy convincente cuando XYZ ha hecho cambios en dicha política en los últimos tres años).
Finalmente, cuando digo "cambiar la configuración de impresión predeterminada" no me refiero a para siempre, solo para mi página, y me refiero específicamente a los márgenes de impresión, encabezados y pies de página.
Soy muy consciente de que CSS ofrece la opción de cambiar la orientación de la página, así como los márgenes de la página. Una de las muchas dificultades es con Firefox. Si establezco los márgenes de la página a 1 pulgada, agrega esto a la media pulgada que ya pone en su lugar.
Yo muy muchos quieren reducir el uso de archivos PDF en el sitio de mi cliente, pero la infracción en la presentación (así como la falta de fiabilidad) son su principal preocupación.
9 answers
El estándar CSS habilita algunos formatos avanzados. Hay una directiva @page en CSS que habilita algún formato que se aplica solo a medios paginados (como el papel). Véase http://www.w3.org/TR/1998/REC-CSS2-19980512/page.html .
La desventaja es que el comportamiento en diferentes navegadores no es consistente. Safari todavía no admite la configuración del margen de página de la impresora, pero todos los demás navegadores principales ahora lo admiten.
Con la directiva @page, puede especificar el margen de la impresora de la página (que no es lo mismo que el margen CSS normal de un elemento HTML):
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Print Test</title>
<style type="text/css" media="print">
@page
{
size: auto; /* auto is the initial value */
margin: 0mm; /* this affects the margin in the printer settings */
}
html
{
background-color: #FFFFFF;
margin: 0px; /* this affects the margin on the html before sending to printer */
}
body
{
border: solid 1px blue ;
margin: 10mm 15mm 10mm 15mm; /* margin you want for the content */
}
</style>
</head>
<body>
<div>Top line</div>
<div>Line 2</div>
</body>
</html>
Tenga en cuenta que básicamente deshabilita los márgenes específicos de la página aquí para lograr el efecto de eliminar el encabezado y el pie de página, por lo que el margen que establecemos en el cuerpo no se utilizará en saltos de página (como comentado por Konrad) Esto significa que solo funcionará correctamente si el contenido impreso es solo una página.
Esto no funciona en Firefox 3.6, IE 7, Safari 5.1.7 o Google Chrome 4.1.
Establecer el margen @page tiene efecto en IE 8, Opera 10, Google Chrome 21 y Firefox 19 .
Aunque los márgenes de página se establecen correctamente para su contenido en estos navegadores, el comportamiento no es ideal para tratar de resolver la ocultación del encabezado/pie de página.
Así es como se comporta en diferentes navegadores:
En Internet Explorer, el en realidad, el margen se establece en 0mm en la configuración para esta impresión, y si lo hace, obtendrá 0mm por defecto, pero el usuario puede cambiarlo en la vista previa.
Verá que el contenido de la página en realidad está posicionado correctamente, pero el encabezado y pie de página del navegador se muestra con un fondo no transparente, y por lo tanto oculta efectivamente el contenido de la página en esa posición.En Firefox las versiones más recientes, es posicionado correctamente, pero tanto el texto del encabezado/pie de página como el texto del contenido se muestran, por lo que parece una mala mezcla de texto del encabezado del navegador y el contenido de su página.
En Opera , el contenido de la página oculta el encabezado cuando se utiliza un fondo no transparente en el css estándar y la posición del encabezado/pie de página entra en conflicto con el contenido. Bastante bueno, pero parece extraño si margen se establece en un valor pequeño que hace que el encabezado sea parcialmente visible. Además, el margen de página no está establecido correctamente.
En las versiones más recientes de Chrome, el encabezado y el pie de página del navegador se ocultan si el margen @page es tan pequeño que la posición del encabezado/pie de página entra en conflicto con el contenido. En mi opinión, esto es exactamente cómo debe comportarse.
Así que la conclusión es que Chrome tiene la mejor implementación de esto con respecto a ocultar el encabezado/pie de página.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-05-23 12:10:44
Cualquier versión reciente de Chrome y Opera, así como Firefox 48 alpha 1 y superior
Puede establecer el margen de la página a un tamaño que es demasiado pequeño para contener el texto con el fin de desactivar esto (tomando prestado de awe's respuesta):
@page {
size: auto; /* auto is the initial value */
margin: 0mm; /* this affects the margin in the printer settings */
}
html {
background-color: #FFFFFF;
margin: 0px; /* this affects the margin on the HTML before sending to printer */
}
body {
border: solid 1px blue;
margin: 10mm 15mm 10mm 15mm; /* margin you want for the content */
}<ol>
<li>
<a href="data:,No Javascript :-(" target="_blank">Middle-click to open in new tab</a>
</li>
<li>
<a href="javascript:print()">Print</a>
</li>
</ol><!-- Hack to work around stack snippet restrictions --><script type=application/javascript>document.links[0].href="data:text/html;charset=utf-8,"+encodeURIComponent('<!doctype html>'+document.documentElement.outerHTML)</script>Para las versiones de Firefox hasta 48 alpha 1
Puede agregar un mozNoMarginBoxes atributo a la etiqueta <html> para evitar la URL, números de página y otras cosas que Firefox agrega a la margen de la página de ser impreso.
Está funcionando en Firefox 29 y en adelante. Puede ver una captura de pantalla de la diferencia aquí, o vea aquí un ejemplo en vivo.
Tenga en cuenta que el atributo mozDisallowSelectionPrint en el ejemplo es no necesario para eliminar el texto de los márgenes; consulte Qué hace el atributo mozdisallowselectionprint en PDF.¿js do?.
Otros navegadores
Desafortunadamente, parece que hay una manera de hacer resuelve este problema en Internet Explorer, por lo que tendrás que recurrir a PDF o pedir a los usuarios que desactiven los textos de margen.
Lo mismo ocurre con Safari; según un comentario de @Luiz Perez, las versiones más recientes de Safari (8, 9.1 y 10) todavía no admiten @page para suprimir textos de margen.
No puedo encontrar nada en Edge y no tengo una instalación de Windows 10 disponible para probar.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-01-20 09:51:42
Como @Awe había dicho anteriormente, esta es la solución, que se confirma para trabajar en Chrome!!
Solo asegúrese de que esto esté DENTRO de las etiquetas de encabezado:
<head>
<style type="text/css" media="print">
@page
{
size: auto; /* auto is the initial value */
margin: 0mm; /* this affects the margin in the printer settings */
}
body
{
background-color:#FFFFFF;
border: solid 1px black ;
margin: 0px; /* this affects the margin on the content before sending to printer */
}
</style>
</head>
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-05-01 12:47:23
Anthony,
Es desafortunado que tanta gente no entendiera tu pregunta. Tengo una solicitud similar de un cliente que quiere eliminar el encabezado, los números de página y el pie de página html. En este caso, el cliente está presentando una página HTML que puede duplicarse como un certificado formal. La URL, la página y el encabezado agregados son irrellevantes y conducen a un producto final menos que agradable. En cierto modo, parece barato.
Media = Print no ha podido desactivar estos navegadores predeterminado. La única solución es decirle al usuario que haga clic en el botón "Engranaje" y active/desactive esos elementos. En serio, no tenía idea de que podría hacer eso durante 20 años (y creemos que el usuario típico tendrá una pista para hacer clic en el botón de alternar?).
Si CSS admite Media=Print, debería admitir la capacidad de controlar toda la experiencia de impresión del usuario final. Aprecio que los navegadores proporcionen los campos agregados, pero, ¿por qué no permitir que CSS controle la experiencia de impresión general? deseable. ¡Una solución del 90% podría ser 100% con tres campos más! Un simple:
#BrowserPrintDefaults{display:none}
Sería suficiente.
De nuevo, no es una cuestión si el usuario final quiere imprimirlo o no (tal vez su cliente es muy privado y no quiere que las URL impresas floten alrededor. O tal vez un equipo ejecutivo utiliza una colaboración privada sitios?). Me alegra defender al usuario final, pero si alguien está buscando una respuesta, no respondas diciendo que es el derecho del usuario final mostrar u ocultar. A veces es el derecho del cliente a pagar las facturas.
So....sin hackear el registro o forzar al usuario a cambiar la configuración en la vista previa de impresión, ¿alguien encuentra una respuesta?
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2011-07-07 18:10:29
No hay forma de cambiar la configuración de la impresora, los márgenes o cualquier otra configuración del navegador, temporal o permanentemente, desde CSS o JavaScript.
Si bien esto es desafortunado para su requisito genuino, estas restricciones son la razón por la que el 95%+ de los usuarios web mantienen JavaScript habilitado en sus navegadores. (Estadísticas del navegador )
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-01-09 18:59:08
Pruebe este código, funciona al 100% para mí:
PARA Paisaje:
<head>
<style type="text/css">
@page{
size: auto A4 landscape;
margin: 3mm;
}
</style>
</head>
PARA Vertical:
<head>
<style type="text/css">
@page{
size: auto;
margin: 3mm;
}
</style>
</head>
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-07-14 12:23:02
Dado que mencionó "dentro de su navegador" y firefox, si está utilizando Internet Explorer, puede deshabilitar el encabezado/pie de página configurando temporalmente el valor en el registro, consulte aquí para ver un ejemplo. AFAIK No he oído hablar de una manera de hacer esto dentro de otros navegadores. Tanto Daniel y Mickel respuestas parece chocar entre sí, Supongo que podría haber una configuración similar en algún lugar en el registro de Firefox para eliminar encabezados/pies de página o personalizarlos. ¿Tienes comprobado?
Espero que esto ayude y felices fiestas, Atentamente, Tom.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2009-12-25 12:32:03
@margen de página:0mm ahora funciona en Firefox 19.0a2 (2012-12-07).
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2012-12-11 16:50:36
Resolví mi problema usando un poco de css en la página web.
<style media="print">
@page {
size: auto;
margin: 0;
}
</style>
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-08-27 06:14:28