JSFiddle - React, Tailwind, and code Playground

HTML

<div class="print">
  <h1>hello world</h1>
</div>
<div class="no-print">
  <p>This shouldn't print</p>
</div>

CSS

@media only screen {
  .print {
    background: wheat;
    padding: 1rem;
  }

  .no-print {
    background: lightblue;
    padding: 1rem;
  }
}

@media print {
  .print {
    background: white;
    padding: 4rem;
    border: 10px solid red;
  }
  .no-print {
    display: none;
  }
}