Некоторые приложения на веб-сайте должны предоставлять пользователям функцию прямой печати страниц. Наиболее очевидным из них является ввод электронных купонов в соответствии с шаблоном, предоставленным веб-сайтом, а затем создание страницы купона, когда пользователь распечатывает эту страницу. , это купон.
Конечно, лучший способ — создать файл изображения на основе этой страницы. Пользователь загружает изображение, а затем распечатывает его. Настройки браузера не будут влиять на эффект печати.
Но если по каким-то причинам в целях ускорения или экономии средств вы не сохраняете страницу в виде файла изображения, то вы можете распечатать только HTML-страницу напрямую, что требует некоторых дополнительных требований к оформлению страницы, здесь два необходимо отметить вещи:
1. Установите атрибуты тега стиля:
<style type="text/css" media="print">
Это означает, что атрибуты стиля, введенные или определенные в этом стиле, используются только при печати. Напоминаем, что если атрибут media не установлен, определенный стиль будет действовать как в браузере, так и при печати, поэтому рекомендуется использовать атрибут. стиль, подобный этому. Размещается после всех обычных стилей. Например, мы надеемся, что на распечатанной странице будет строка «Печать и Yahoo Word of Mouth Network», но в браузере это нереально:
<p class="printTitle">Сеть распространения информации о печати и Yahoo</p>
Затем мы можем установить .printTitle{display:none;} в едином стиле и установить для него значение .printTitle{display:block;} в последующем стиле, где носитель является «печатным». Определенные стили печати не имеют более высокого приоритета, чем регулярно определенные стили при печати, поэтому снова рекомендуется размещать стили печати после всех обычных стилей.
2. При печати страницы настройки браузера будут влиять на эффект печати. В IE есть пункт «Печать цвета фона и изображения» в «Инструменты» — «Свойства обозревателя» — «Дополнительно», аналогичный в Firefox. В «Файл» — «Параметры страницы» есть пункт «Печать цвета и изображения фона». При выборе этой опции цвет фона и изображение на странице можно распечатать (в некоторых браузерах с нестандартным ядром IE это, похоже, есть). Некоторая проблема: цвет фона можно напечатать, а фоновое изображение — нет). Если он не выбран, ни цвет фона, ни изображение не могут быть напечатаны. Поэтому, чтобы оградить пользователей от разных браузеров и настроек браузера, я предлагаю два. Во-первых, в качестве границы используется область, заполненная цветом фона, и добавляется граница толщиной 1 пиксель. Цвет такой же, как цвет фона, поэтому при печати в браузере не видно никаких изменений. даже если настройки пользователя запрещают печать цвета фона, границы все равно могут использоваться в качестве разделителей, а макет страницы сохраняется на самом большом слое. Второй вариант — использовать теги <img/> для всех основных изображений, чтобы эти изображения можно было распечатать независимо от того, как настроен браузер пользователя. Это может быть то же самое, что и Обычно некоторые страницы оформляются по-разному, но чтобы унифицировать эффект печати, нам придется только уступить.
Я просто поднял некоторые проблемы, возникающие в практических приложениях. Если у вас есть какие-либо новые вопросы или идеи, вы можете вынести их на совместное обсуждение, я сначала выложу их здесь;
Исходный текст: http://ued.koubei.com/?p=918.