Смотрите распечатать CSS в браузере

Question

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

Например, при предварительном просмотре распечатки в Chrome, где вы можете проверить элементы

@media print {
   p{color:red;}
   ..... my css
}
.sharebar {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 195;
    font-size: 12px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    text-transform: uppercase;
}

Answer 1

Chrome имеет эту функциональность из коробки в DevTools - см. Эмуляция CSS Media Type.

Answer 2

Сделайте это в Chrome:

1. Откройте Инструменты разработчика
2. Нажмите кнопку меню "Настроить и контролировать DevTools".
3. Выберите Дополнительные инструменты> Настройки рендеринга.
4. Установите флажок "Эмулировать CSS-носители" на вкладке "Рендеринг" и выберите тип печатного носителя.

Очень подробные шаги можно найти здесь.

Answer 3

Если вы используете Firefox, вы можете использовать для этого панель инструментов веб-разработчика (и многое другое!)

http://chrispederick.com/work/web-developer/

После установки панели инструментов этот параметр можно найти в разделе "CSS -> Отображать стили по типу носителя" -> "Отображать стили печати".