Luo tulostusystävällinen sivu Gutenberg.css n kanssa

Web-suunnittelijat unohtavat usein Tulosta koska se näyttää nykyään paljon vähemmän tarpeelliselta. Tämä voi olla totta myös digitaalisilla sivustoilla, kuten BuzzFeed.

Kuitenkin informatiivisia verkkosivustoja se on edelleen hyvä käytäntö tarjota a mukautettu tulostustyyli. Onneksi sinun ei tarvitse suunnitella omaa, koska Gutenberg on täällä auttamaan.

Tämä CSS-kirjasto on painokoneen keksijän Johannes Gutenbergin jälkeen nimetty resurssi tulostaa sivumallit.

Sinä vain lisää gutenberg.css tiedosto osallistu asiakirjan päähän, ja olet kaikki asetettu.

Aina kun kävijä menee tulostamaan sivusi, sen pitäisi olla automaattisesti uudelleen tulostusasetuksen perusteella. Tämä voidaan asettaa käyttämällä media = "print" HTML-määrite.

Tutustu tähän oppaaseen, jos haluat oppia lisää tulosta tyylitaulukoita ja miten he toimivat.

Mukava asia Gutenbergissä on se mukana tulee ylimääräisiä luokkia ja tyylejä liian.

Kaivaa teemat-kansioon ja löydät kolme vaihtoehtoista tulostusteemaa: kirja, moderni, ja vanha tyyli. Voit tehdä minkä tahansa näistä oletusarvo lisäämällä ne oletusarvon päälle gutenberg.css tiedosto.

Voit myös tyyli sivua eri tavalla tulostusta varten lisäämällä tiettyjä CSS-luokkia. Esimerkiksi .no-print luokan tahto piilottaa kokonaan elementin tulostustyyli.

Toinen esimerkki on linkin URL-osoitteiden lisääminen tekstin vieressä. Gutenberg lisää tämän ominaisuuden, jotta ihmiset voivat helpommin etsiä URL-osoitteita sivulta. Mutta voit lisätä .no-alustaa luokkaa ankkurielementtiin piilota URL-osoite.

Kaikki nämä asiat on käsitelty GitHub-repossa ja se on hyvin yksinkertaista. Voit olla Gutenberg asennettu alle 5 minuutissa ja koko sivustosi on tulostusystävällinen.

Tämä on ylivoimaisesti yksi yksinkertaisimmista ja tyylikkäimmistä kirjastoista parantaa sivuston suorituskykyä. Se voi lisätä muutaman ylimääräisen KB: n, mutta kokonaiskokemus paranee huomattavasti.

Jos sivustosi sisältö voi olla koskaan painettu mistä tahansa syystä sitten Gutenberg.css on välttämätön resurssi.