时间戳

首页 > 解决方案 > Show checkbox as if unchecked when printing?

css - Show checkbox as if unchecked when printing?

问题描述

I have a website with a list of checkboxes that can be used for printing as well. Though when printing it should print a clean slate, not the current state of the checkboxes on the website. However, I don't want to clear the state on the page itself, only on the printed version.

So is it possible to visually remove the tick from checkboxes in CSS?

Something like:

@media print
{
    input[type=checkbox]
    {
        tick: none;
    }
}

标签： cssmedia-queries

解决方案

我建议以下方法。

在打印中，您只需要可以手动勾选的边框，对吗？

因此，在打印 CSS 中，您可能只是更改复选框的设计，以便隐藏原始复选框 html ，无论是否选中都无关紧要。然后只需使用一些伪选择器设置样式或显示方形边框框，例如：之前：之后，，对于用于打印的复选框来说已经足够好了。

与通过 CSS 一样，您可以更改设计而不是表单的 html 状态。因此，在打印或打印样式表的媒体查询中，唯一的选择是设计、样式...

推荐阅读