Quando un utente fa clic su un pulsante, HTML consente loro di aggiungere dati a un contenitore e stampare alcuni contenuti HTML. Di conseguenza, si apre il dialogo di stampa del browser, ma il contenuto della pagina web non è stampato. Tuttavia, questa operazione stampa alcuni altri testi HTML che non sono visibili nella pagina.

Questo post dimostrerà sulla stampa del contenuto HTML con il clic di un pulsante ma non la pagina.

Come stampare il contenuto di HTML facendo clic su un pulsante?

Il CSS "@media"La regola viene utilizzata per applicare una sezione di un foglio di stile basato sui risultati di una o più domande sui media. Gli utenti possono fornire una query multimediale se e solo se soddisfa il dispositivo utilizzato per visualizzare il contenuto.

Per stampare il contenuto HTML con un clic di un pulsante, prova le istruzioni seguenti.

Passaggio 1: inserire prima intestazione

Prima di tutto, aggiungi la prima intestazione con l'aiuto del tag di intestazione da "

" al "

"Tag, dove il

Il tag viene utilizzato per la testa più importante.

Passaggio 2: aggiungi la seconda intestazione

Quindi, aggiungi una seconda intestazione usando "

Passaggio 3: Crea pulsante

Successivamente, crea un pulsante utilizzando il ""Elemento. Quindi, aggiungi i seguenti attributi all'interno:

• "tipo"L'attributo alloca il tipo di input. Ad esempio, il “pulsante"Il tipo viene utilizzato per creare un pulsante.
• Successivamente, il "valore"L'attributo viene utilizzato per specificare il valore per un elemento di input. Questo attributo può essere utilizzato in molti modi per vari tipi di input.
• L'utente può utilizzare il "Al clic"Attributo per eseguire un evento su un elemento HTML.
• "classe"Specifica una o più classi per un elemento. L'attributo di classe viene utilizzato principalmente per indicare una classe in un foglio di stile:

Creatori di contenuti Linuxhint (stampa questo)

Creatori di contenuti TSL (nessuna stampa)

Di conseguenza, viene creato un pulsante che può essere utilizzato per stampare il contenuto HTML sul clic di un pulsante.

Come stampare il contenuto HTML su clic di un pulsante, ma non la pagina?

Per stampare il contenuto HTML con il clic di un pulsante senza stampare l'intera pagina, guarda le istruzioni fornite.

Passaggio 1: utilizzare la regola "@media"

Ora, utilizza il "@media"Regola per stampare il contenuto specifico del Div senza stampare l'intera pagina. Per fare ciò, accedi alla classe Div usando ".NoprinT ”selettore.

Passaggio 2: attributo della classe di accesso

@media print
.noprint
visualizzazione: nessuno;


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

Accedi all'attributo di classe utilizzando il valore della classe e applica il "Schermo"Proprietà di CSS con il valore"nessuno". Quindi, applica il "colore"Proprietà per la testa dell'utente desidera stampare.

Produzione

Si può osservare che quando si fa clic sul pulsante, il contenuto HTML aggiunto è pronto per la stampa.

Conclusione

Per stampare il contenuto di HTML facendo clic su un pulsante, ma non la pagina, prima, crea due intestazioni. Quindi, crea un pulsante utilizzando il “"Elemento e aggiungi gli attributi, incluso"tipo","al clic", E "classe". Successivamente, usa il “finestra.stampa()"Come"al clic" valore. Dopodiché, utilizza il "@media.stampa"Regola e accedi al valore di classe per la stampa del contenuto HTML al clic di un pulsante. Questo post ha dimostrato il metodo per stampare il contenuto sul clic di un pulsante.