need to hide button after clicking in window.print-CodePudding

i need to display:none to my print button after clicking it. But that printing page open with window.open command. so i tried to inline css to not displaying it for printing but it not working.

this is where i put inline css

  <input type="button" style="  @media print{ display: none; }"  id="printPageButton"   
 onclick="   window.print();   "     value="Print" >

CodePudding user response：

Media query doesn't exists in Inline CSS. You can use CSS @media queries in external CSS file. For instance:

@media print {
  #printPageButton {
    display: none;
  }
}

<h1>Content to print</h1>
<button id="printPageButton" onClick="window.print();">Print</button>

The styles defined within the @media print block will only be applied when printing the page. You can test it by clicking the print button in the snippet; you'll get a page with "Content to print" text.