Cuando un usuario hace clic en un botón, HTML les permite agregar datos a un contenedor e imprimir algún contenido HTML. Como resultado, se abre el diálogo impreso del navegador, pero el contenido de la página web no está impresa. Sin embargo, esta operación imprime algún otro texto HTML que no sea visible en la página.

Esta publicación demostrará sobre la impresión del contenido HTML con el clic de un botón pero no la página.

Cómo imprimir contenido de HTML haciendo clic en un botón?

El CSS "@medios de comunicaciónSe utiliza la regla para aplicar una sección de una hoja de estilo basada en los resultados de una o más consultas de medios. Los usuarios pueden proporcionar una consulta de medios si y solo si satisface el dispositivo utilizado para ver el contenido.

Para imprimir el contenido HTML con un clic de un botón, intente las instrucciones a continuación.

Paso 1: inserte el primer encabezado

En primer lugar, agregue el primer encabezado con la ayuda de la etiqueta de encabezado de "

" hacia "

"Etiqueta, donde el

La etiqueta se utiliza para el encabezado más importante.

Paso 2: Agregar segundo encabezado

A continuación, agregue un segundo encabezado usando el "

Paso 3: Crear botón

Después de eso, cree un botón utilizando el "" elemento. Luego, agregue los siguientes atributos dentro:

• "tipoEl atributo asigna el tipo de entrada. Por ejemplo, el "botónSe utiliza el tipo para crear un botón.
• A continuación, el "valorSe utiliza el atributo para especificar el valor para un elemento de entrada. Este atributo se puede usar de muchas maneras para diversos tipos de entrada.
• El usuario puede utilizar el "Al hacer clic"Atributo para realizar un evento en un elemento HTML.
• "clase"Especifica una o más clases para un elemento. El atributo de clase se usa principalmente para señalar una clase en una hoja de estilo:

Creadores de contenido de Linuxhint (imprima esto)

Creators de contenido de TSL (sin impresión)

Como resultado, se crea un botón que se puede utilizar para imprimir el contenido HTML en el clic de un botón.

Cómo imprimir contenido HTML al hacer clic en un botón, pero no la página?

Para imprimir el contenido HTML con el clic de un botón sin imprimir la página completa, mire las instrucciones dadas.

Paso 1: utilizar la regla "@media"

Ahora, utiliza el "@medios de comunicación"Regla para imprimir el contenido específico del DIV sin imprimir toda la página. Para hacerlo, acceda a la clase DIV usando el ".NOPRINT ”selector.

Paso 2: Atributo de clase de acceso

@Media Print
.NOPRINT
Pantalla: ninguno;


H1
Color: RGBA (50, 9, 233, 0.4);

Acceda al atributo de clase utilizando el valor de la clase y aplique el "mostrar"Propiedad de CSS con el valor"ninguno". Luego, aplique el "color"Propiedad para el encabezado que el usuario desea imprimir.

Producción

Se puede observar que cuando se hace clic en el botón, el contenido HTML agregado está listo para imprimir.

Conclusión

Para imprimir el contenido de HTML haciendo clic en un botón, pero no en la página, primero, cree dos encabezados. Luego, cree un botón utilizando el ""Elemento y agregue los atributos, incluyendo"tipo","al hacer clic", y "clase". A continuación, usa el "ventana.imprimir()"Como un"al hacer clic" valor. Después de eso, utilice el "@medios de comunicación.imprimir"Regla y acceda al valor de clase para imprimir el contenido HTML con el clic de un botón. Esta publicación demostró el método para imprimir el contenido al hacer clic en un botón.