Как только показать определенные части с CSS для Печати?
Я хочу использовать R, а не предварительно обрабатывать данные, поскольку это облегчает пересмотр данных. Следуя предложению Шейна использовать gsub, я думаю, что это примерно так же аккуратно, как я могу:
x <- read.csv("file.csv",header=TRUE,colClasses="character")
col2cvt <- 15:41
x[,col2cvt] <- lapply(x[,col2cvt],function(x){as.numeric(gsub(",", "", x))})
5 ответов
Начните здесь . Но в основном вы думаете о правильном подходе.
Спасибо, теперь мой вопрос на самом деле становление: Как применить CSS к класс И ВСЕ ЕГО ПОТОМКИ ЭЛЕМЕНТЫ? Чтобы я мог подать заявку "display: block" на все, что находится в «печатные» зоны.
Если для элемента задано значение display: none; , все его дочерние элементы также будут скрыты. Но в любом случае. Если вы хотите, чтобы стиль применялся ко всем дочерним элементам чего-то еще, вы делаете следующее:
.printable * {
display: block;
}
Это применит стиль ко всем дочерним элементам зоны «printable».
Я попал сюда, потому что мне было любопытно напечатать диаграмму, сгенерированную chart.js. Я хотел просто напечатать диаграмму прямо со страницы (с помощью кнопки, которая делает «window.print») без всего остального содержимого страницы.
Итак, я стал ближе, используя технику из ответа здесь: Почему я не могу переопределить свойство отображения, примененное через звездочку? .
Вы должны применить звездочку к элементу body, а не только к нему. Итак, используя пример CSS, который ОП (Натан) добавил к вопросу, я изменил его следующим образом:
<style type="text/css">
@media print {
body * {display:none;}
.printable, .printable > * {
display: block !important;
}
}
</style>
Затем добавив этот «пригодный для печати» класс к самой диаграмме, как в
<canvas id="myChart" class="printable" width="400" height="400"></canvas>
, из-за которого при нажатии кнопки «печать» были удалены все элементы страницы на распечатке, кроме таблицы:
<script>
myChart.render();
document.getElementById("printChart").addEventListener("click",function(){
window.print();
});
</script>
Так что, возможно, это поможет любому, кто доберется до этого вопрос через гугл.
Почти все браузеры поддерживают его. Может быть полезным использовать атрибут media в теге link.
Использование display: none; в некоторых ваших правилах будет подходящим способом справиться с вашей ситуацией.
Предлагаю скрыть элемент, который вы не будете печатать:
HTML
<h1 class="no-print" >Welcome Just Screen</h1>
<div> I want print this section :)</div>
<div class="no-print">It's display only on screen</div>
CSS
@media print {
.no-print {
display: none;
}
}
Если вы хотите отображать некоторые ссылки и т. Д. В браузере, вы не хотите их печатать. Кроме того, у вас есть логотипы и фирменные бланки, которые должны быть только на распечатанной странице. Кажется, это работает нормально:
Пример:
CSS:
@media print {
.noPrint {
display:none;
}
}
@media screen {
.onlyPrint {
display: none;
}
}
HTML:
<div class="noPrint" id="this_is_not_printed" >
<a href=links.html>
</div>
<div class="onlyPrint" id="this_is_only_seen_on_printer" >
<img scr=logo.png >
<img scr=letterhead.png >
</div>