Как я могу позволить пользователю загрузить мою веб-страницу в формате PDF с включенными стилями? - PullRequest
Новая
       5

Как я могу позволить пользователю загрузить мою веб-страницу в формате PDF с включенными стилями?

0 голосов
/ 13 января 2020

У меня есть файлы html и css, которые выглядят так: 

<head>
  bootstrap
</head>

<body>
  <h2 class="bootstrap style">   HELLO </h2>
</body>

Теперь я хочу дать пользователю возможность загрузить эту веб-страницу в формате PDF.

Нажатием кнопки.

Что я пробовал:

Я смотрел на html в pdf конвертер в Javascript однако я не думаю, что это включает в себя стили.

Мне также было интересно, есть ли встроенный атрибут html, который может помочь с этим.

1 Ответ

0 голосов
/ 13 января 2020

Если стили не отображаются на печати, вы должны использовать @media print{} в вашем файле css и включить все необходимые стили внутри. затем используйте window.print() в javascript для печати страницы.

Простой пример: 

function print_content() {
  window.print();
}
@media print {
  #content {
    background-color: beige;
    text-align: center;
    padding: 20px;
  }
  #content button {
    display: none;
  }
}
<div id="content">
  <h1>Heading of the paragraph</h1>
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>

  <button onclick="print_content()">click me to Print</button>
</div>

Дополнительные параметры см. В этом документе

Дизайн для печати с CSS

https://www.smashingmagazine.com/2015/01/designing-for-print-with-css/

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

Нет похожих вопросов

...