Не удалось получить мой пользовательский CSS в режиме печати (Ctrl + P) - PullRequest
Новая
       18

Не удалось получить мой пользовательский CSS в режиме печати (Ctrl + P)

0 голосов
/ 22 марта 2019

Я создал простую HTML-страницу с моим собственным CSS. но в режиме печати (ctrl + p) в режиме предварительного просмотра не отображается css, а содержимое отображается только с элементами html.

Я использовал media="all", но не мог работать. Что мне делать?

1 Ответ

0 голосов
/ 22 марта 2019

Когда вы говорите пользовательский CSS , я предполагаю, что вы хотите, чтобы оформление представления печати отличалось от оформления представления экрана. Для этого вам не нужно указывать тип media в вашем теге link. Вместо этого вы можете просто добавить запрос печатного носителя в свой CSS, выполнив @media print { myStyles }. Вам нужно только указать media в теге link, если у вас есть несколько разных таблиц стилей, которые должны применяться при разных обстоятельствах.

При запуске следующего фрагмента текст тега p изменится с черного шрифта на красный при входе в режим печати. ​​

.container {
  border: 1px solid red;
  min-height: 100%;
  min-width: 100%;
}

p {
  border: 1px solid black;
  margin: 5px;
  padding: 5px;
}

@media print {
  p {
    color: red;
  }
}
<div class="container">
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing 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. Duis aute irure
    dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>

Если вы не хотите, чтобы CSS для печати отличался от CSS для экрана, вам не нужно делать ничего особенного. CSS по умолчанию применяет медиазапросы, если не указано иное.

...