Občasno lahko na internetu ustvarite niz cen za statistiko, če jih želite vnaprej prebrati. Hkrati pa se ne pri vseh storitvah različica stattyja prenese za prijatelja, ker naša bazhania ne uporablja možnosti (želimo prepisati sliko ali spremeniti vrsto glavne pisave). Jak, drukuvati stran brez elementov? Za to je na voljo spletna storitev.
Na glavni strani PrintWhatYouLike na sredini zaslona je obrazec za vnos naslova prijateljeve strani. Naslov je bil uveden, stran je blokirana і mi bachimo, vendar je pri izbiri med elementi vmesnik obdan z rdečim okvirjem. Ponovno se s pritiskom na levi gumb prikaže seznam možnih operacij. Elemente vmesnika lahko vidite enega za drugim ali v skupinah, širijo vibracije na mejah ali vibrirajo en blok na besedilo, ko so igrali vse. Tako imate možnost, da to storite enega za drugim, ne potrebujete za drug del strani, ali hitro in enostavno, če ga potrebujete v drugi vrsti.
Na levem delu zaslona je majhna plošča s številnimi funkcijami za urejanje strani:
Za udobje PrintWhatYouLike postavite na ploščo z zaznamki gumb za urejanje pred drugo stranjo, kot smo videli. To uporablja tudi možnost PageZipper. Vona bo pametna pri branju virov, rada bo razdelila en članek na pet, deset ali več strani. Odtisnete "Step on the road", spet "Step on the road", a pozor, ni kaj prebrati. PageZipper bo razdelil celoten članek na eno stran za enostavno urejanje in skupno rabo. Ne želim postaviti zaznamka, razpoložljivega vtičnika za Firefox PageZipper 0.6.1.
Registriranim uporabnikom PrintWhatYouLike bom predlagal nadzorno ploščo, pridobil informacije o številu nameščenih tiskalniku prijaznih gumbov, ki so shranjeni v papirju, so varčni v penijih in niso bili sesekljani v lesu vzdušje, na način, ki ne naredi razlike.
Blogerji lahko prinesejo tudi nekaj cimeta. Vstavljanje vtičnika v izdelek, preden se pojavi na strani kože bloga, gumb za pošiljanje člankov prijatelju, možnost shranjevanja povezav v format PDF, da se bralcu omogoči uporaba pisav in tiskalnikov tiskalnika.
Prej je bil preprosto standard za nastavitev ali, natančneje, gumb z napisom "Različica za prijatelja". Smrad je potreben, da ga spravimo ven na verando. Različica za prijatelja, da se maščuje vsem potrebnim informacijam, čeprav v enem izmed današnjih interaktivnih elementov: gumbi, samo obrazec.
Tse pomeni, da ga bom samodejno predal za dodaten scenarij
ko sem vzel izvirni dokument i, vedel vse o njem, ko sem odprl njegovo kopijo,
zruchn_shu za prijatelja. Mozhlivo, s podobnim robotom, prinesel
skrbeti zate.
Ena od odličnih lastnosti CSS je moč
osnovne tabele slogov, organizirane na fleksibilnih priponkah
vivedennya. Ustvarili smo zvok zložljivih miz za prikaz stranic
zaslon, čeprav niso razmišljali o tem, niso razmišljali o tem. JAZ,
kako sprejeti "različico za prijatelja", o prijatelju z dokumenti
Razmišljam samo o vložitvi dokumenta v іnshomu viglyadі.
Ale zdaj se imamo malo bati, zdaj za konec prijateljičine različice
potrebujemo dokument, če nimamo dobro strukturiranega dokumenta i
stilske mize za prijatelje!
Danes lahko vzamete (X) dokument HTML in ga pripravite
Za prijatelja za pomoč stilske mize, ne vztrajajte. I os y
prenesel težavo skozi vrata in sinhronizacijo obeh različic
dokument - eden za zaslon, іnshy - za drugega. I scho sama
Spomnim se: zrobiti tse nayprostishe.
Brskalniki družine Gecko, kot sta Netscape 6.x in Mozilla, Mayut
problem tiskanja dolgih plavajočih elementov.
Kot plavajoči element Wiyshov med stransko stranjo, torej
del, ki je bil izgubljen, bo povzročil izgubo, saj se ni pojavil v ofenzivi
stran.
Vaše spletno mesto je podobno A List Apart, tobto. statistiko na novem področju
v enem velikem plavajočem bloku, potem to pomeni, da berete kdaj
prijatelj otrimayut prikrajšan za prepričevanje statistike.
Rishennya, yak і slіd bulo ochіkuvati, polyagaє u skasuvannі yakostі
"plavajočo" oznako na blok z besedilom pred pečatom. Kratka je, za vse
plavajoči elementi bodo nastavljeni na slogovno pravilo "float: none".
Ko zlomite tse, boste obračali vse plavajoče elemente, dokler ga ne boste videli
dokument bo obravnavan tako, da je bil prenesen.
stran vse do konca.
Otzhe, isto, proponuvav zrobiti Zeldman za ALA, i, yak
tilki vin tse zroiv, se je pojavila težava s pečatom. Družinski brskalniki
Gecko tsya pomilka, yak і prej, ni popravljen (v času pisanja
statti), a vseeno lahko preprosto zaobidete predlagani način.
Spodaj je tabela v slogu "drukovan", s pomočjo katere je A List Apart prikazal problem drugih plavajočih elementov:
#meni (prikaz: brez;) #wrapper, #content (širina: samodejno; obroba: 0; rob: 0 5%; padding: 0; float: brez! pomembno;)
Okrasite uho. Tabela slogov bo tako povečala desni del menija
ne priti v prijatelja, in postaviti meje in korake za
namesto stattyja v takem rangu besedilo na strani be-yakiy
roztashovuvavsya rіvnomіrno od roba regije do drugega.
Težava, ker sem bil bachilos, je bila v tem, da je bilo veliko stilov, ki so bili razbiti za ekran, šli so skozi proces.
Yaksho se čudi oznaki vmist
novi članki na spletni strani ALAImamo datoteko tabel slogov, print.css,
Druge priloge "print" so povezane z vrednostmi atributa "media".
Datoteka slogovnih listov nucss2.css, za uvoz za pomoč
konstrukcije @import, dobrodošli iz Navigatorja 4.x, če vikoristaniy
pri vizualizaciji strani na kateri koli prilogi (atribut
mediji = "vse"). Tse mozhe buti zaslon, tiskalnik, projektor, sintetizator
Premakni se in vzemi Inche. Ko se roz_isovshis, bi lahko pisali v slogovni list za
druge direktive za barvo ozadja stranic in uporabo pisav v
picsel.
Članek na temo: Wordpress nima delujočega gumba za dodajanje prevelike datoteke
Kaj bo velika bitka? Ні, аааааааааааааааааааaaaa brskalnikov
Kandidati ne zavajajo ozadja strani, ampak so označeni v slikovnih pikah velikosti
pisave, priloge za prikaz na zaslonu, ne toliko
korisnі pіd uro druku.
V ta namen naredimo tri odvečne naše slogovne liste drug za drugega in zadnjih nekaj težav pri razvoju komponent.
Za elemente desnega stranskega menija izberite desni stranski meni.
Ale ljudje so pograbili meni za uro ali dve, nikoli ne bomo imeli možnosti.
To nas naenkrat razbremeni mladostnega glavobola.
Drobci tiskalnika se ne zlomijo z barvo
bily. Prav tako je treba videti vsa ozadja slike, kot npr
vikoristovuvalysya pіd uro vivedennya partinki na zaslonu.
Yakshho mi klic na pomoč moč ozadja, mi v enem zamahu virishimo
žaljive težave. Schob zrobiti rіshennya nnuchіshim, naloga za element
"telo" je boljše kot "ovij" in "vsebina"
luknjo v telesu (in skozi njih lahko vidite
"telo"):
telo (ozadje: belo;) #meni (zaslon: brez;) #ovij, #vsebina (širina: samodejno; rob: 0 5%; oblazinjenje: 0; obroba: 0; plavajoče: nič! pomembno; barva: črna; ozadje : pregleden;)
Zasnova barve ospredja (barva pisave) sploh ni bila
Nujno, a lepše, ne pozabite na tse. Otzhe, naenkrat imamo dva
»neplavajočih« elementov (#wrapper, #content) z jasnim pogledom na ozadje, tj
stran z lahkim pepelom.
Lahko jih zgrabite, kot je cena vrednosti Navigator 4.x
"prozorno", ale vische nis: NN4.x živali
slogi, za katere ima atribut "media" vrednost "screen". Torej ja
kot direktiva @import, naše slogovne liste za prijatelja
Poglejte v oči Navigator 4. Otzhe, tukaj je neumno
turbuvatisya.
Splošna tabela slogov je oblikovana za pisavo 11 slikovnih pik. Duzhe
nedaleč vibir za eno uro do drugega. Sama družina pisav je zbirka Gruzije,
in nato serif - v redu je, da greste za prijatelja, zato kot pisave iz sniffs
zazvychay lepše viglyadayut na verandi. Potrebno je spremeniti velikost
pisava. Os je taka:
telo (ozadje: belo; velikost pisave: 12pt;)
"Rezi!" - mabut, viguknete vi. - "Punkture so zlo!"
No, no, no, no, ko sem to rekel in ko sem to rekel, je za ekran nemogoče
nastavite velikost pisave za odstavke. S prijateljem, zasosuvannya pts.
ima tako samy smisel, kot veliko deset let do tega. Yaksho vzhe mi gotuєmo
stilsko tabelo za prijatelja, nato spremenite velikost pisave za "body" na 12
poanta bo pravilna in naravna.
Vy, slyly, lahko vprašate biti-kot velikost, kot prošnja, prote
pisava ima 12 točk največ namestitve. Najprej in predvsem v naslovni tabeli
slogi vseh ostalih elementov stranic so zagotovo podani
velikosti v elementu "telo", naš robot je končan.
Posebna slogovna pravila, ki jih je treba nastaviti za oba in za desne kordone
(obrobe) elementi ovojni in velikost vsebine 5%. Tse pomeni, scho z obh
stran stattyja bo "prazna miška", koža pa bo tudi "prazna miška".
prepognite 10 % širine območja na drugo. Tse dedovanja bloka z
besedilo statti "vsebina" mora biti na sredini okvirnega bloka "ovij", to
koža od njih je manjše polje za 5 % z leve in desne strani.
Članek na temo: Yak izpolnite glavo spletnega mesta
Obrisni slog tabele nazaj 15 % desno oblazinjenje
za blok "vsebina". Cordoni nam je že dal 10%, potrebujemo tudi mi
do 5 %. Tse do konca samo zrobiti:
div # vsebina (margin-left: 10 %;)
Pri prvi možnosti rešitve je možno preseči maržo
umirite in dajte 5% levemu oblazinjenju. Oskіlki blok "vsebina"
ni viden v ozadju, smo vzeli tak rezultat.
Škoda, da imajo brskalniki lahko težave z ustreznim
zaradi oviranja oblazinjenja, tako da se elementi zamenjajo s stranico
lepše s pomočjo kordonov (margin).
Bulo še ena zvita hrana - kako lahko delaš s hipermočmi? Očitno naprej
prijatelj ne more zavohati smradu, kot na monitorju, vendar je pogosto pomembno
dajte ključ, preden je bil v originalih najden smrad. Otzhe, os mene
Vinayshov:
a: povezava, a: obiskano (barva: # 520; ozadje: prozorno; teža pisave: krepko; okras besedila: podčrtaj;)
Tse daє poilannyam kolіr, doseči temo, biti blizu
črn s črno-belim prijateljem, izgubi se ob isti uri temen črv
pіd uro kolorovoy druku. Krepka pisava in garancija za pіdkreslennya,
posilannya vid_lyatimetsya v pripravljenem besedilu.
V brskalniku, ki bo prilagodil specifikacijo CSS2, lahko
vnesite URL in pošljite sporočilo zanje,
ki se bo prikazal, da bo ta brskalnik odprl ročno. Spodaj je prikazano pravilo
kako se zatakne samo za blok "vsebina" in s tem rangom URL-ja
іnshhh, da ne bi bili ujeti narobe:
#vsebina a: povezava: po, #vsebina a: obiskano: po (vsebina: "(" attr (href) ")"; velikost pisave: 90%;)
Preizkusite ga v brskalnikih na platformah Gecko - Mozilla ali Netscape
6.x. Pri razvoju kože jo morate pretresti v lokih.
na njen URL.
Brskalniki, ki nimajo razumnega sloga, ga običajno nimajo
nebazanikh efektyv - če je tako, boste temni črv,
pidkreslenim in maščobnim. Samo pisanje k besedilu
URL, na katerega se je treba sklicevati, od vseh.
Spoštujem te za tiste, ki so udarili pred in za loke є
del slogovnega pravila - ne pozabite na jase, zato je kriv smrad
buty vključki pred dokumentom.
Praviloma obstaja ena naravna težava. Prav v tem
Naročeno mi je, da v dokument vstavim vrednost atributa
href.
Če pogledam kodo ob strani spletnega mesta A List Apart, mi shvidko
poleg tega ni lich, ti "vidnosilan" um
"/ vprašanja / 144". Smrad bo tak gledalec vstavil v dokument, kot smrad
є, če pa želite, uporabite URL-je.
Za takšne vipade lahko uporabimo CSS3. Bodite kot izbirnik atributov,
vikoristic operator ^ =, izberite elemente, zaponі na storž их
vrednost za atribut. V takem rangu mi mogo vibrati biti atribut href,
se napolni s poševnico in vanjo vstavi besedilo,
enako vrednost za atribut.
#content a: po (vsebina: "(//www.alistapart.com" attr (href) ")";)
Celotno pravilo bo preoblikovalo vse vrednosti vrste "/ issue / 144 /",
"//www.alistapart.com/issues/144/". Splošno pravilo je, da ne morete pomagati
spustni meni s pravilnimi URL-ji, če tega ne morete popraviti s poševnico, ale, prej
Na srečo ALA ni nadomestna vrsta posilana.
UVAGA! POMEMBNO! Yak bolo je rekel, selektor misli ^ =
glejte izbirnike, specifične za CSS3. Validator za CSS vid
Konzorcij W3 ga lahko preizkusi glede posebnih specifikacij
CSS1 in CSS2. Ne bodite pametni glede selektorja, samo uporabite CSS3, validator bo
glej na milost, če ne prekoračiš selektorja
priporočila za posebnosti.
Ponovno pogledam preostalo različico tabele slogov, I
ko se je pojavil, mi "klobuk" na strani ne bi smel biti bolj primeren. Shvidshe Bula na desni
ne v sami glavi, ampak v zelo "navihanem" imenu strani. Tse
sedež se je tam očitno končal, slika se je končala
glavo. Zaspal sem na lutki z vznemirjenjem
sedežna linija je celotna širina stranice.
Как упоминалось выше, перед выводом на печать веб-страница должна быть соответствующим образом отформатирована. То есть, к документу должен быть подключен необходимый CSS файл одним из рассмотренных в предыдущем пункте методом. Удобный способ создания такого файла кратко описан в этом посте . Нам осталось рассмотреть несколько важных рекомендаций, которых необходимо придерживаться при редактировании CSS файла, предназначенного для распечатываемой страницы.
Если, при выводе на экран документа используется какое-либо фоновое изображение или просто фоновая заливка, а также если вы применяете цветной шрифт, отличный от стандартного варианта (черного), то при создании CSS файла для печати нужно отменить это форматирование. Распечатываемая страница должна выглядеть как можно проще – белый фон и черный шрифт. Многие пользователи для распечатки веб-документов используют чёрно-белый режим печати. К тому же, при распечатывании страницы с насыщенной цветовой схемой значительно повышается расход чернил или тонера.
В оформлении текста большинства веб-страниц, предназначенных для чтения онлайн применяют рубленые шрифты — sans serif (без засечек), так как они считаются более удобными при чтении с экрана монитора. Но при перенесении страницы на бумагу, ситуация меняется и здесь более подходящими будут шрифты с засечками — serif , для которых характерны небольшие декоративные элементы (засечки) на окончаниях каждой буквы. Считается, что именно засечки способствуют направлению взгляда пользователя в нужном направлении – по тексту. Поэтому, большие объемы текста должны быть оформлены шрифтом с засечками (Times New Roman , Georgia , Palatino и другие).
Если для отображения текста на экране допустимо использовать относительно мелкий размер шрифта (11 пикселей, а иногда и меньше), то для печатного варианта страницы необходимо увеличить его минимум до 12 пикселей, но никак не меньше – все зависит от аудитории, на которую рассчитана содержащаяся в документе информация.
Для того, чтобы информация, размещаемая на странице была выражена наиболее полным образом, при ее переносе на бумагу нужно визуально выделить все присутствующие в ней гиперссылки, так как в этом случае они уже не являются кликабельными и должны иметь особую форму отображения. Для этой цели зачастую используют подчеркивание ссылок и смену цвета шрифта их анкорного текста на синий.
Важность используемых в веб-документе изображений определяется несколькими факторами, зависящими как от его разработчика, так и от маркетингового отдела компании, владеющей сайтом. В идеале, рекомендуется оставить лишь те изображения, которые несут смысловую информацию, являясь иллюстрациями к представленному тексту, а также логотип сайта, как правило, находящийся в верхнем левом углу страницы.
Среди множества компонентов, которые являются бесполезными в распечатанном варианте веб-страницы можно выделить навигационное меню и другие элементы, так или иначе связанные с навигацией по сайту. Поэтому оставляя их на странице при распечатке, вы попросту зря тратите чернила. Более того, удалив их, вы освободите дополнительное полезное место для текста, и тем самым представите его в более читабельном виде.
В идеальном случае, для пользователей, распечатывающих веб-страницу с целью чтения содержащейся на ней информации, рекламные объявления в виде баннеров и других форм графической и текстовой информации не представляют никакой ценности. И нужно было бы полностью избавиться от нее в нашем случае, но реальность диктует свои условия. Большинство сайтов в Интернете существуют благодаря именно рекламе, и поэтому ее удаление может привести к негативным последствиям. Поэтому рекламные продукты, представленные на сайте, зачастую остаются при распечатке его страниц, но если вы можете сократить их количество до минимума или упростить форму их представления, то это будет идеальным вариантом. Постарайтесь найти золотую середину, если это возможно.
Интерактивные графические элементы, управляемые при помощи скриптов, а также анимированные Flash изображения, как правило, распечатываются некорректно, а в отдельных случаях дефекты их печати («сползание») могут повлиять на качество отображения текста, что совсем неприемлемо.
Даже в том случае, если на вашем сайте, при публикации статей не указывается информация об их авторе (а делать это рекомендуется), эти данные следует включать в состав страниц для печати. Что позволит пользователям, которые распечатывают исходный материал и работают с ним в более удобном для них виде и/или месте, иметь возможность узнать информацию об авторе, без необходимости повторного посещения вашего сайта.
Включение полного URL адреса распечатываемой страницы в нижней, заключительной ее части является очень важным моментом. Это позволит пользователям быстро вернуться на нее и воспользоваться какой-либо ссылкой, ведущей на другую страницу, содержащую расширенную информацию по рассматриваемому вопросу или с другой целью. В любом случае, это способствует повторному посещению вашего ресурса пользователем. К тому же, при дальнейшем размножении распечатанной страницы (при помощи фотокопий, например), о вашем сайте узнают больше людей.
Вся информация, которая находится на вашем веб-ресурсе охраняется авторскими правами и принадлежит только вам. Даже в том случае, если пользователь, руководствуясь исключительно потребительскими намерениями, распечатывает страницу, это не значит, что содержащаяся на ней информация теперь может использоваться в коммерческих целях. Поэтому сведения об авторских правах обязательно должны переноситься и на печатную копию документа. Это, конечно, не сможет предотвратить факт воровства, но, по крайней мере, напомнит злоумышленнику о том, что именно вы обладаете авторскими правами на эту информацию.
Соблюдая все перечисленные выше рекомендации по форматированию веб-страниц, предназначенных для печати, вы сможете удовлетворить требования большинства пользователей, которые по различным причинам вынуждены работать с распечатанными на принтере документами. А это, как следствие, поможет вам сформировать группу пользователей, составляющих целевую аудиторию вашего сайта.
Post Views: 330
Есть два способа делать страницу для печати:
1. Специально выводить отдельным скриптом страницу без меню и лишнего оформления.
2. Выводить ту же страницу, которую просматриваем при просмотре сайта, но уже с другими подкреплёнными стилями, где скрываются ненужные элементы.
Довелось делать документы(накладные, счёт фактура и прочее) для печати. Так что пошёл по первому варианту. Но это просто в моём случае. Более гибкий как мне представляется второй вариант.
Вот мой опыт, заметки:
1. Главное правило — будь проще и люди к тебе потянутся(с)хз кто. 🙂 Короче не используйте разнообразие оформления. Человеку просто надо прочитать распечатанный текст, нечего его грузить лишним оформлением. Да и краску в принтере тратить.
2. Не используем фоновые изображения, их всё равно не будет при печати. Или будут, но не во всех браузерах. По крайней мере у меня какие то подобные грабли случались.
3. Стараемся использовать белый фон, чёрный текст. Если обратно, то будет тратиться много краски. Цветной текст думаю не нужно делать — всё равно у многих чёрно-белый принтер.
4. Если нужно чтобы следующий контент печатался обязательно на следующей странице, вставляем блок div с классом pagebreak перед этим текстом. Описываем класс в стилях:
Pagebreak { page-break-after: always; }
Pagebreak { page - break - after : always ; |
текст за этим блоком будет распечатываться уже на новой странице. Работает во всех современных браузерах. Да и не современных то же. Один IE до 7ой версии включительно подводит. Но на него надо забивать!
5. И так, печать. Пользователь можно сам выбрать печать. Можно поставить на
window.onload = function () { window.print(); }
и сама кнопка:
< button onclick = "window.print();" > Печать< / button > |
Это кнопка будет при просмотре страницы, но печататься не будет, так как мы задали display: none; в style для media=»print», то есть в стилях для печатающего устройства. При нажатии на кнопку будет выводиться окно печати.
Тем, кто хочет супер автоматизировать процесс печати, чтобы например открываем страницу и принтер сразу начал печатать страницу — охладите свой пыл или того, кто вас просит это сделать. Я этот способ не нашёл. Да его и нет. Потому что это логично. Представьте, заходите вы на сайт, а там через javascript запрограммлена печать ста копий страниц. И принтер приходит в бешенство и начинает печатать эту кучу страниц без вашего ведома. Нелогично? Нелогично!
В одно время меня усердно просил сделать такую штуку один менеджер проектов. Пришлось ему всё это обяснять, приводить примеры, чтобы он понял что это нельзя сделать, да и не нужно.
6. Если кто то будет жаловать на то, что распечатываются адрес страницы, title и прочая херь в колонтитулах — посоветуйте ему настроить свой браузер. Со стороны сайта это не настраивается. По крайней мере я не знаю как. Например в Firefox это настраивается в «Печать» — «Параметры страницы» — «Поля и колонтитулы»
7. Кстати в догонку к предыдущему. Допустим пользователь отключил вывод всех колонтитулом, в том числе и адрес страницы. То есть если пользователь спустя некоторое время посмотрит на распечатку, он не сможет понять, с какого сайта он это распечатал. Так может стоит сделать небольшую заметку с указанием ресурса, адреса страницы, логотипа или ещё чего нибудь.
8. Используйте крупный размер шрифт(в пределах разумного конечно). Главное чтобы при печати всё было читабельно.
10. Думаю нужно использовать размерности, независимые от устройства — абсолютные размерности. Например in,cm,mm,pt,pc.
11. Вот полезная ссылка http://www.webdevout.net/browser-support-css#css2propsprint . Описание стилей можно найти на сайте http://htmlbook.ru
Вообще советую пройтись по всему списку CSS свойств, даже если вы опытный разработчик. Для себя с удивлением обнаружил незнакомые CSS свойства и что некоторые CSS свойства уже можно безбоязненно использовать.
Конечно же это не полный список советов. Это просто мои мысли.
Часто на сайтах можно встретить версию для печати той или иной страницы . Многие думают, что это что-то встроенное в сам браузер или что это делается очень просто. На самом деле, это совсем не так. Версия для печати - это обычная страница , которую Вам нужно самостоятельно сделать.
Вы можете посмотреть на версию для печати у этой статьи. Фактически, что нужно отображать там? Название статьи, раздел, категория, автор, сам текст и дата. Всё это и выведено на эту страницу. Нужны ли меню, форма поиска, различные блоки? Не думаю, поэтому их и нет.
Так же убедитесь, что ширина версии для печати не превосходит 650px , иначе браузер может порезать края.
Итак, Вы уже поняли, что версию для печати Вам надо создавать самостоятельно, выводя ровно то, что нужно пользователю. Теперь о том, как это сделать.
Есть 2 варианта : создать отдельную страницу и создать отдельный файл стилей. Первый вариант, думаю, понятен. Создаёте ещё одну страницу с версией для печати и на основной странице даёте ссылку на эту печатную версию. Пользователь по ней переходит и через "Файл"->"Печать" он её распечатает.
Второй вариант подразумевает создание отдельной таблицы стилей, где Вы скроете все лишние блоки (через display: none; ) и поставите соответствующие размеры у выводимого контента. Дальше такой файл стилей подключается следующим образом:
Теперь если пользователь захочет распечатать эту страницу, то распечатается не то, что он видит, а то, что прописано в print.css . Фактически, пользователь видит страницу в одном виде, а принтер в совсем другом.
Вот таким образом создаётся версия для печати любой страницы сайта.