Os navegadores nos permitem adicionar estilos especí�cos para quando uma página for impressa pelo usuário. Isto pode ser feito de duas maneiras: Com o atributo media na tag link ou criando um bloco de CSS dentro da diretiva @media print

@media print.css

/* O atributo "media" indica que estes estilos
só devem ser aplicado para impressões */
<link href="print.css" media="print">

/* OU */

@media print {
  /* Este CSS só será aplicado quando a página for impressa */
  * {
    background: transparent !important ;
    border-color: #000 !important ;
    box-shadow: none !important ;
    color: #000 !important ;
    text-shadow: none !important ;
  }
  /* O uso do !important é para garantir que esta regra sobrescreva qualquer outro
seletor mais específco do seu CSS padrão */

  a {
    text-decoration: underline !important ;
  }

  a[href]::after {
    content: " (" attr(href) ")";
  }

  /*Links que não possuem uma url a seguir, como links
  que utilizam funções de JavaScript não devem receber este efeito, então precisamos 
  remover o pseudo elemento nestes casos, utilizando um seletor mais específco que
  o anterior:*/
  a[href]::after {
    content: " (" attr(href) ")";
  }
  a[href^="javascript:"]::after, a[href^="#"]::after {
    content: "";
  }
  
  /* Para controlar quebra de página há 3 propriedades dinponíveis: 
  page-break-before, page-break-inside e page-break-after */
  article {
   page-break-after: always;
    /* A propriedade page-break-before e page-break-after aceita os valores always, utilizado
    para forçar a quebra, ou avoid, indicando para o navegador que a quebra deve
    ser evitada. */
  }
  
  /* Com page-break-inside, que aceita apenas as opções auto e avoid, podemos
    definir que o conteúdo de um parágrafo não deve ser quebrado entre duas
    páginas. */
  p {
    page-break-inside: avoid;
  }

 }