How does this print style sheet work?

I really like how http://www.honorshaven.com/ looks printed (in pdf format). I looked at the source to try and figure out how they did it (my navigation always turns into ugly print bullet lists ...) - and I'm at a loss. Somebody knows? Any help would be awesome! Thanks, Martin

[Edit] I am familiar with print stylesheets, but are they mostly related to the "print friendly" / "print me" link? In this case, I simply go to the browser panel and select print. I'm sure I'm missing something stupid, but I don't know what ...

+3
source share
3 answers

You need to use a stylesheet designed for printing. To do this, set the type of print media instead of everything or the screen. In this separate style sheet, you can hide your navigation menus, change fonts, spacing, margins, etc., and it depends on the print.

Here's a great ListApart article on CSS styles .

+8
source

You can specify which style sheet to use for different media.

In this case, they implement a special print style sheet to handle everything for printing the page.

Check out this W3 page for the various media types available:

W3C - Media Types

+1
source

, rel rel. , media = "all". , .

+1
source

Source: https://habr.com/ru/post/1747211/


All Articles