2013-09-24 3 views
-1

У меня есть проект с использованием компонентных элементов. Но когда я выбираю «Файл»> «Предварительный просмотр» из браузера, он находится в большом беспорядке. Я сделал некоторые поисковые запросы и понял, что мы можем создать print.css, чтобы решить эту проблему. Но я не видел никаких улучшений.реплицировать то, что на экране при печати

Есть ли способ воспроизвести то, что находится на экране для печати?

body { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    font-size: 25pt; 
} 

h1,h2,h3 { 
    page-break-after: avoid; 
    page-break-inside: avoid; 
} 

table { 
    width: 100%; 
    border-collapse: collapse; 
    border-spacing: 0; 
    border-top: 0.5pt solid #000; 
} 

th,td { 
    display: table-cell; 
    border-bottom: 0.5pt solid #000; 
} 

blockquote { 
    page-break-inside: avoid 
} 

ul,ol,dl { 
    page-break-before: avoid 
} 

.noprint,.noscreen,#search,#nav,#aside { 
    display: none; 
} 

#main { 
    width: 100%; 
} 

#header { 
    border-bottom: 0.5pt solid #000; 
} 

#footer { 
    border-top: 0.5pt solid #000; 
} 
+0

Это во многом зависит от CSS вы используете и настройки пользователя. У большинства браузеров есть возможность отключить цвета фона, когда печать по умолчанию отключена. Как вы манипулировали печатным CSS-файлом, можете ли вы отправлять образцы и живой URL? Боюсь, вы действительно не предоставили достаточно информации здесь ... – BenM

ответ

0

какой CSS вы используете для печати цели вы можете использовать один и тот же CSS, но с дополнительным атрибутом

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

элемент media = "print"

положить это и ваш просмотр будет работать нормально

+0

Я сделал это, но все еще в беспорядке. Не уверен, что я пропущу что-нибудь. – bittersour

0

Вы можете использовать print.css, чтобы обеспечить оптимизированный стиль для вашего макета печати и заказать свой «большой беспорядок».

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

Есть ли способ, чтобы повторить то, что на экране для печати?

Если я тебя прямо здесь, это может помочь вам: jQuery Waypoints

http://imakewebthings.com/jquery-waypoints/examples/scroll-analytics/

Смежные вопросы