用html onClick window.print()改变CSS？

在前端开发中，可以使用window.print()方法来控制打印页面。但是这个方法本身并不能直接改变CSS样式，而是调用浏览器的打印功能来输出页面。如果需要在打印前修改CSS样式，可以通过以下几种方式实现：

使用内联样式：可以在需要打印的元素上添加style属性，直接设置样式。例如：

<div id="printArea" style="color: red; font-size: 16px;">Hello, world!</div>
<button onclick="print()">Print</button>

<script>
  function print() {
    var printArea = document.getElementById("printArea");
    printArea.style.color = "blue"; // 修改样式
    window.print(); // 调用打印功能
  }
</script>

动态修改样式表：可以通过JavaScript动态创建、修改、删除样式表，从而达到修改CSS样式的目的。例如：

<style id="printStyle">
  .printText { color: red; font-size: 16px; }
</style>
<div class="printText">Hello, world!</div>
<button onclick="print()">Print</button>

<script>
  function print() {
    var printStyle = document.getElementById("printStyle");
    printStyle.innerHTML = ".printText { color: blue; }"; // 修改样式
    window.print(); // 调用打印功能
  }
</script>

使用CSS媒体查询：可以在CSS样式表中使用@media print媒体查询，根据打印时的特殊需求来设置样式。例如：

<style>
  .printText { color: red; font-size: 16px; }
  
  @media print {
    .printText { color: blue; }
  }
</style>
<div class="printText">Hello, world!</div>
<button onclick="print()">Print</button>

<script>
  function print() {
    window.print(); // 调用打印功能
  }
</script>

以上是三种常用的方法来改变打印时的CSS样式。不同方法适用于不同场景，根据实际需求选择合适的方式进行样式修改。