如何通过CSS实现Unipark问卷页面正常显示但不可打印？

你之前的问题出在直接给body设置display: none，这会让页面在所有状态下都隐藏。要实现仅打印时为空、正常浏览正常显示的效果，需要用CSS的打印媒体查询，只在打印触发时生效。

直接用下面的CSS代码即可：

@media print {
  body {
    display: none !important;
  }
}

优化建议 #

如果能通过浏览器开发者工具找到问卷内容的具体容器类名（比如Unipark可能用.tiv-survey-content这类类名），可以更精确地只隐藏问卷内容，避免影响页面默认的空白区域：

@media print {
  .tiv-survey-content { /* 替换成实际的问卷容器类名 */
    display: none !important;
  }
}

验证方法 #

添加自定义CSS后，用快捷键Ctrl+P（Windows）或Cmd+P（Mac）打开打印预览，确认预览页面为空；同时正常浏览问卷网站，内容能正常显示即可。

内容的提问来源于stack exchange，提问作者fabi80v