css @media print在chrome下载中不显示

由 发布于

我有一个用于简单文件的@media打印方法，并且工作良好，但是我想向用户显示下载内容，因此我希望显示为正常下载，但没有显示，在下载时不会显示media打印方法。

我可以将文件下载为pdf格式，但下载时不会显示

有什么办法可以更好地解决这些问题或进行修复？

@media print {
  .invoice-page {
    * {
      visibility: hidden;
    }

    #content-area {
      margin: 0 !important;
    }

    #invoice-container,
    #invoice-container * {
      visibility: visible;
      background-repeat: no-repeat;
    }
    #invoice-container {
      position: absolute;
      left: 0;
      top: 0;
      box-shadow: none;
    }
    #planeOnQuote {
      display: block;
      position: absolute;
      width: 60%;
      margin-top: 0vh;
      z-index: 1;
    }

    #QuoteNumber {
      margin-top: -6vh;
      display: block;
    }

    #QuoteNumber2 {
      margin-top: -10vh;
      display: block;
    }

    #LogoProyectQuote {
      display: block;
      position: relative;
      width: 35%;
      margin-top: -50px;
    }

    #LogoProyectQuote2 {
      display: block;
      position: relative;
      width: 35%;
      margin-top: -30px;
    }
    #CompanyDetail {
      margin-top: 0vh;
    }
    #ClientDetail {
      position: absolute;
      display: block;
      margin-top: 9vh;
      background-repeat: no-repeat;
    }
    #QuoteTableSteps {
      position: relative;
      display: block;
      z-index: 999999;
      margin-top: -6vh;
    }
    .chipColor {
      background-color: #000;
    }
   
  }
}

????