CSS (kaskádové šablóny so štýlmi) vám poskytujú značnú kontrolu nad tým, ako sa obsah vašich webových stránok zobrazuje na obrazovke. Táto kontrola sa rozširuje aj na iné médiá, napríklad pri tlači webovej stránky.
Možno sa čudujete, prečo by ste chceli pridať funkcia tlače na svoju webovú stránku; koniec koncov, väčšina ľudí už vie alebo môže ľahko prísť na to, ako vytlačiť webovú stránku pomocou ponúk svojho prehliadača.
Existujú však situácie, keď pridanie tlačidla tlače alebo odkaz na stránku nielen uľahčia proces vašim používateľom, keď potrebujú stránku vytlačiť ale možno ešte dôležitejšie je, že vám dávajú väčšiu kontrolu nad tým, ako sa tieto výtlačky budú zobrazovať papiera.
Tu je postup, ako na svoje stránky pridať tlačené tlačidlá alebo tlačové odkazy a ako definovať, ktoré časti obsahu vašej stránky sa vytlačia a ktoré nie.
Pridanie tlačového tlačidla
Tlačidlo tlače môžete na svoju webovú stránku ľahko pridať pridaním nasledujúceho kódu do svojho dokumentu HTML, na ktorom sa má tlačidlo zobraziť:
onclick = "window.print (); return false;" />
Tlačidlo bude označené ako Vytlačte túto stránku keď sa objaví na webovej stránke. Tento text si môžete prispôsobiť podľa svojich predstáv zmenou textu medzi nasledujúcimi úvodzovkami
hodnota =vo vyššie uvedenom kóde.
Upozorňujeme, že pred textom a za ním je prázdne miesto; tým sa vylepšuje vzhľad tlačidla vložením medzery medzi konce textu a okraje zobrazeného tlačidla.
Pridanie odkazu na tlač
Je jednoduchšie pridať na svoju webovú stránku jednoduchý tlačový odkaz. Do svojho dokumentu HTML vložte iba nasledujúci kód, v ktorom sa má odkaz zobraziť:
vytlačiť
Text odkazu môžete prispôsobiť zmenou výrazu „tlačiť“ na ľubovoľný obsah.
Vytlačenie konkrétnych oddielov
Môžete nastaviť, aby používatelia mohli tlačiť konkrétne časti vašej webovej stránky pomocou tlačidla alebo odkazu na tlač. Môžete to urobiť pridaním a print.css na svoj web, zavolajte ho do hlavičky dokumentu HTML a definujte tie časti, ktoré chcete ľahko vytlačiť definovaním triedy.
Najskôr do nasledujúceho oddielu dokumentu HTML pridajte nasledujúci kód:
type = "text / css" media = "print" />
Potom vytvorte súbor s názvom print.css. Do tohto súboru pridajte nasledujúci kód:
telo {viditeľnosť: skryté;}
.print {viditeľnosť: viditeľné;}Tento kód definuje všetky prvky v tele ako skryté pri tlači, pokiaľ elementu nie je priradená trieda „print“.
Teraz musíte iba priradiť triedu „print“ prvkom vašej webovej stránky, ktoré chcete vytlačiť. Napríklad, ak chcete časť, ktorá je definovaná v prvku div, vytlačiť, použijete
Na stránke, ktorá nie je priradená k tejto triede, sa nevytlačí nič iné.