Forum PHP.pl > [CSS][HTML][inne]Wydruk tylko wybranego elementu.

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [CSS][HTML][inne]Wydruk tylko wybranego elementu.

sadistic_son

11.12.2010, 23:31:44

Witam. Jak wydrukować tylko wybrany element np. <div id="print">. Oczywiscie nie oczekuje odpowiedzi typu: "Zanzacz dany element, skopiuj do Worda i wydrukuj".
Mam np. ponizsza stronke:

[HTML] pobierz, plaintext 
<body>
<div id="main">
<form id="form" action="xx" method="post">
<input type="submit" name="print_below" value="Wydrukuj ponizszy fragment" />
inputy itp.
</form>
<div>
COS TAM
</div>
 
<div id="print">
TYLKO TO MA SIE WYDRUKOWAC
</div>
 
</div>
<div id="footer">
STOPKA
</div>
</body>
[HTML] pobierz, plaintext

Jakies pomysly?

thek

11.12.2010, 23:38:31

Zdefiniować dodatkowy styl dla mediatype = print

[HTML] pobierz, plaintext 
<link rel="stylesheet" type="text/css" media="print" href="print.css">
[HTML] pobierz, plaintext

i zabawa z display

sadistic_son

11.12.2010, 23:42:00

Nie do końca rozumiem Twoja podpowiedź.
Mam stworzyć oddzielny plik zawierający tylko element do wydruku?

thek

12.12.2010, 00:07:11

Nie... Stwórz dodatkowy arkusz stylów, który zawiera informację o tym jak drukować stronę

Skoro znasz układ swojej, to możesz napisać w nim, że

[CSS] pobierz, plaintext 
#top, #menu, #sidebar{
display:none;
}
[CSS] pobierz, plaintext

i elementy o tych id nie będą ani drukowane, ani widoczne na podglądzie wydruku. do różnych typów mediów można pisać osobne arkusze kaskadowe. Inne dla drukarki, inne dla projektora, inne dla ekranu. To, że zazwyczaj pisze się jeden jest po prostu uogólnieniem, które ustawia jeden dla nich wszystkich. Można jednak zdefiniować osobny

w tych dla drukarki zazwyczaj ustawia się body na białe, tekst na czarno, usuwa tła, manipuluje kolorem linków czy choćby usuwa obrazki. Wszystko po to, by wydruk był jak najmniej zaśmiecony niepotrzebnym rzeczami. Bo po co choćby na wydruku menu? Kliknie w nie i mu się inna kartka pojawi?

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.