CSS стиль печати - PullRequest
       14

CSS стиль печати

9 голосов
/ 17 августа 2011

У меня есть страница, которая хорошо отображается на экране.

У меня есть CSS, который затем форматирует экран для печати и изменяет размеры разделов.

Моя проблема в том, что макет печати имеет отступ примерно в дюйме от левой части страницы, из-за чего 2 элемента печатаются за пределами страницы справа.

Возможно, я могу сжать содержимое справа, но я хочу знать, могу ли я уменьшить поле слева (и, по сути, центрировать содержимое)

Я установил тег body для печати на margin:0; padding: 0;, но это не имеет никакого эффекта?

Есть ли другая настройка, управляющая полями печати?

Ответы [ 2 ]

22 голосов
/ 17 августа 2011

Вы можете установить поле печати (и альбомную ориентацию) с помощью CSS, например:

@media print {
    @page {
        size: letter landscape;
        margin: 4.0cm;
    }
}


И хорошая новость в том, что это работает! (В Chrome. Не поддерживается в других браузерах , хотя я не тестировал IE9.)

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

Chrome не будет уменьшать поле ниже фиксированного минимума, который может быть определен драйвером принтера.

0 голосов
/ 17 августа 2011

Вы также можете попробовать установить

margin:0; и padding:0;

до html, main content div и p тегов

и посмотрите, поможет ли это.

В противном случае, вам лучше всего установить определенный width для ваших элементов.

...