Создайте страницу для печати с Gutenberg.css
Веб-дизайнеры часто забывают о печати, потому что в наше время она кажется гораздо менее необходимой. И это может быть верно для цифровых сайтов, таких как BuzzFeed.
Однако на информационных сайтах по-прежнему рекомендуется предлагать пользовательские таблицы стилей для печати. К счастью, вам не нужно создавать свой собственный, потому что Гутенберг здесь, чтобы помочь.
Названная в честь изобретателя печатного станка Йоханнеса Гутенберга, эта библиотека CSS является автономным ресурсом для дизайна печатных страниц.
Вы просто добавляете файл gutenberg.css в заголовок документа, и все готово.
Программы для Windows, мобильные приложения, игры - ВСЁ БЕСПЛАТНО, в нашем закрытом телеграмм канале - Подписывайтесь:)
Всякий раз, когда посетитель отправляется на печать вашей страницы, он автоматически переустанавливается в зависимости от настроек печати. Это можно установить с помощью HTML-атрибута media = “print”.
Читайте также: Использование CSS3 Page Break для организации печати страниц
Проверять, выписываться это руководство если вы хотите узнать больше о печатных таблицах стилей и о том, как они работают.
Приятной особенностью Гутенберга является то, что он поставляется с дополнительными классами и стилями.
Копаться в папка тем и вы найдете три альтернативные темы печати: книга, современный и старый стиль. Вы можете сделать любой из них по умолчанию, добавив их поверх файла gutenberg.css по умолчанию.
Кроме того, вы можете по-разному оформить страницу для печати, добавив определенные классы CSS. Например, класс .no-print полностью скрывает элемент в стиле печати.
Другим примером является добавление ссылки URL рядом с текстом. Гутенберг добавляет эту функцию, чтобы людям было легче находить URL-адреса с вашей страницы. Но вы можете добавить класс .no-reformat к элементу привязки, чтобы скрыть URL.
Все эти вещи покрыты на GitHub репо и это очень просто. Вы можете установить Gutenberg менее чем за 5 минут, и весь ваш сайт будет доступен для печати.
Это, безусловно, одна из самых простых и крутых библиотек для улучшения производительности сайта. Это может добавить несколько дополнительных килобайт, но общее впечатление будет значительно улучшено.
Если содержание вашего сайта может быть напечатано по какой-либо причине, то Gutenberg.css является незаменимым ресурсом.
Читайте также: Дизайн пользовательского интерфейса: применение CSS на основе ориентации экрана
Программы для Windows, мобильные приложения, игры - ВСЁ БЕСПЛАТНО, в нашем закрытом телеграмм канале - Подписывайтесь:)