Показывать флажок как будто не отмечен при печати?

Question

У меня есть веб-сайт со списком флажков, которые также можно использовать для печати. Хотя при печати следует печатать с чистого листа, а не с текущим состоянием флажков на сайте. Однако я не хочу очищать состояние на самой странице, только в печатной версии.

Так можно ли визуально 1004 * убрать галочку с флажков в CSS?

Что-то вроде:

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

Answer 1

Я предлагаю следующий подход.

В печати вам нужен только квадрат прямоугольной рамки, который может быть отмечен вручную, верно?

Таким образом, при печати CSS вы можете просто изменить дизайн флажков, чтобы скрыть исходный флажок html, независимо от того, установлен флажок или нет. А затем просто создайте стиль или покажите квадратную рамку с помощью некоторого псевдоселектора, например: before: after, достаточно для флажка, выглядящего как поле для печати. ​​

Как и при помощи CSS, вы можете изменить дизайн, а не html состояние форм. Таким образом, в медиа-запросе печати или таблицы стилей печати только вариант - это дизайн, стиль ...