Ocultar elementos al imprimir usando CSS

A veces necesitamos crear facturas, boletas, recibos o cualquier otro documento usando la web.

No lo tenemos fácil, ya que hay muchas restricciones debido a la seguridad; por ello tenemos que recurrir a trucos como generar una página, llamar a window.print() y confiar en que el usuario final usa un buen navegador como Chrome.

Pero dejando atrás todo eso, nos encontraremos siempre con que necesitaremos que algunas partes se vean en la impresión, y otras que no. Esto lo podemos hacer usando CSS de la siguiente manera:

Después, podemos usar esta clase para ocultar los elementos que no queremos que salgan en la impresión de la siguiente forma:

Los elementos que no tengan esta clase serán siempre visibles. Aquí dejo una demostración en codepen.

Encantado de ayudarte


Estoy disponible para trabajar en tu proyecto, modificar el programa del post o realizar tu tarea pendiente, no dudes en ponerte en contacto conmigo.

No te pierdas ninguno de mis posts

Suscríbete a mi canal de Telegram para recibir una notificación cuando escriba un nuevo tutorial de programación.

1 comentario en “Ocultar elementos al imprimir usando CSS”

  1. Pingback: Imprimir ticket en impresora térmica usando Javascript - Parzibyte's blog - El blog de Luis Cabrera

Dejar un comentario