Comment imprimer le contenu HTML en cliquant sur un bouton, mais pas sur la page?

Comment imprimer le contenu HTML en cliquant sur un bouton, mais pas sur la page?
Lorsqu'un utilisateur clique sur un bouton, HTML lui permet d'ajouter des données à un conteneur et d'imprimer un contenu HTML. En conséquence, le dialogue d'impression du navigateur s'ouvre, mais le contenu de la page Web n'est pas imprimé. Cependant, cette opération imprime un autre texte HTML qui n'est pas visible sur la page.

Ce message montrera l'impression du contenu HTML en cliquant sur un bouton mais pas à la page.

Comment imprimer le contenu de HTML en cliquant sur un bouton?

Le CSS "@médias"La règle est utilisée pour appliquer une section d'une feuille de style basée sur les résultats d'une ou plusieurs requêtes multimédias. Les utilisateurs peuvent fournir une requête multimédia si et seulement si elle satisfait l'appareil utilisé pour afficher le contenu.

Pour imprimer le contenu HTML en un clic sur un bouton, essayez les instructions ci-dessous.

Étape 1: Insérez la première cap

Tout d'abord, ajoutez la première tête à l'aide de l'étiquette de cap de «

" au "
”Tag, où le

La balise est utilisée pour le titre le plus important.

Étape 2: Ajouter le deuxième titre

Ensuite, ajoutez une deuxième rubrique en utilisant le "

Étape 3: Créer un bouton

Après cela, créez un bouton en utilisant le "" élément. Ensuite, ajoutez les attributs suivants à l'intérieur:

  • "taper»L'attribut alloue le type d'entrée. Par exemple, le «bouton»Le type est utilisé pour créer un bouton.
  • Ensuite, le «valeur»L'attribut est utilisé pour spécifier la valeur d'un élément d'entrée. Cet attribut peut être utilisé de plusieurs manières pour divers types d'entrée.
  • L'utilisateur peut utiliser le «Sur clic”Attribut pour effectuer un événement sur un élément HTML.
  • "classe»Spécifie une ou plusieurs classes pour un élément. L'attribut de classe est principalement utilisé pour pointer une classe dans une feuille de style:


Créateurs de contenu LinuxHint (imprimez ceci)



Créateurs de contenu TSL (pas d'impression)


En conséquence, un bouton est créé qui peut être utilisé pour imprimer le contenu HTML sur le clic d'un bouton.

Comment imprimer le contenu HTML en cliquant sur un bouton, mais pas sur la page?

Pour imprimer le contenu HTML en cliquant sur un bouton sans imprimer toute la page, regardez les instructions données.

Étape 1: Utilisez la règle «@media»

Maintenant, utilisez le «@médias”Règle pour imprimer le contenu spécifique de la div sans imprimer toute la page. Pour ce faire, accédez à la classe Div en utilisant le «.noprinSélecteur T ”.

Étape 2: Attribut de classe d'accès

@media print
.noprint
Affichage: aucun;


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

Accédez à l'attribut de classe en utilisant la valeur de la classe et appliquez le «afficher"Propriété de CSS avec la valeur"aucun". Ensuite, appliquez le «couleur»Propriété à la tête de l'utilisateur veut imprimer.

Sortir

On peut observer que lorsque le bouton est cliqué, le contenu HTML ajouté est prêt à imprimer.

Conclusion

Pour imprimer le contenu de HTML en cliquant sur un bouton, mais pas la page, créez d'abord deux titres. Ensuite, créez un bouton en utilisant le "”Element et ajoutez les attributs, y compris"taper","sur clic", et "classe". Ensuite, utilisez le «fenêtre.imprimer()«En tant que«sur clic" valeur. Après cela, utilisez le «@médias.imprimer”Règle et accédez à la valeur de classe pour imprimer le contenu HTML en cliquant sur un bouton. Ce message a démontré la méthode d'impression du contenu sur le clic d'un bouton.