Стиль ввода HTML, чтобы скрыть поле, но показать содержимое - PullRequest
4 голосов
/ 30 сентября 2008

У меня есть форма в HTML, где наши пользователи заполняют данные, а затем распечатывают их. Данные нигде не сохраняются. Эти формы приходят из-за пределов нашей компании и создаются в виде html-страниц, максимально приближенных к оригиналу, а затем помещаются и забываются в папке во внутренней сети. Обычно другой разработчик делает их, но я должен сделать несколько, пока он отсутствует. Просматривая его код, все его формы имеют кучу серверного кода, который принимает входные данные и переписывает страницу только с содержимым. Кажется, должен быть лучший путь.

Я хочу просто стилизовать ввод текста с помощью селектора мультимедиа, чтобы при его печати можно было видеть текст, но ничего из поля, окружающего его. Есть мысли?

Ответы [ 3 ]

11 голосов
/ 30 сентября 2008

Добавьте отдельный файл CSS для печати, выполнив что-то вроде этого:

<link rel="stylsheet" type="text/css" media="print" href="print.css">

добавить его в раздел <head> страницы.

В этом файле (print.css) содержатся стили, относящиеся к тому, что вы хотите видеть при печати страницы, например:

input{border: 0px} должен скрывать границы полей ввода при печати. ​​

7 голосов
/ 30 сентября 2008

Предполагая, что вы хотите удалить только границы и тому подобное из текстов, вам нужно дать им класс. Может быть что-то вроде:

<input type="text" class="print-clean" .../>

И CSS, загруженный с носителя = "печать":

<link rel="stylesheet" type="text/css" media="print" href="/css/print.css" />

будет содержать что-то вроде этого:

.print-clean {
    border: none;
    background: transparent;
}
4 голосов
/ 30 сентября 2008
<input type="text" style="border: 0; background-color: #fff;" />

Где #fff - ваш фоновый цвет ..

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...