У некоторых элементов формы HTML есть дополнительный интерфейс, прикрепленный к ним, например стрелки вверх/вниз на number
. Однако при печати страницы эти кнопки больше не нужны, так как пользователь не может взаимодействовать с ними в печатной форме.
Текстовые поля легко справляются с:
@media print {
input {
border: none;
border-bottom: 2px solid #000000;
}
}
Делает их печать довольно красиво, как строка с текстом на нем. Так же, как форма, которую вы заполняете вручную. Однако, делая то же самое для входов, таких как number
, вы получаете эти неприятные стрелки вверх/вниз:
И тогда есть еще менее полезные распечатки, такие как range
, что ничего не значит, когда на странице:
Есть ли способ обойти это? Любой способ стилизовать ту часть элемента, которая будет невидимой, но все же увидеть значение/текст?
Я понимаю, что можно поменять атрибут type=""
с помощью JS или иметь другой элемент, содержащий значение, которое будет отображаться на печать, но если есть решение, которое может быть сделано только с помощью CSS, это будет лучше.