Søg
Avatar billede l_otto Nybegynder
05. marts 2009 - 15:15 Der er 23 kommentarer

Kun et område der skal printes

hvordan styler jeg mig ud at at når jeg klikker print printer den kun det jeg vil.. eks.

topmenu med alt muligt


Relevant tekst der skal printes:
Jeg er meget vigtigt.
Avatar billede ladyhawke Novice
05. marts 2009 - 15:24 #1
lav et media print stylesheet?

forstår ikke lige helt det sidste du skriver?
Avatar billede zips Juniormester
05. marts 2009 - 15:24 #2
Ved at have 2 css filer, en til print og en til skærmvisning.

<link rel="stylesheet" type="text/css" href="screen.css" media="screen" />
<link rel="stylesheet" type="text/css" href="print.css" media="print" />

Og brug #menu{display:none;} til det du ikke ønsker udskrevet i din print.css
Avatar billede mclemens Nybegynder
05. marts 2009 - 15:28 #3
<link rel="stylesheet" href="css.css" type="text/css">
<link rel="stylesheet" href="print.css" type="text/css" media="print">

hvor du definerer det du ikke skal udskrive i print.css f.eks.:
body * {display:none;}
#printes {display:block!important;}
- hvis elementet med id #printes ligger for sig selv i body.
Ellers nøjes du blot med at give de elementer der skal udskrives display:none.
Avatar billede l_otto Nybegynder
05. marts 2009 - 15:28 #4
Den skal jeg lige have igen med kode på ...



<HTML>
<HEAD>
  <TITLE> New Document </TITLE>
  </HEAD>
<BODY>
 
(Skal ikke printes)
jeg vil ikke printes..


(Skal printes)
jubii det virker

</BODY>
</HTML>
Avatar billede ladyhawke Novice
05. marts 2009 - 15:29 #5
du behøver ikke have to forskellige filer, du kan godt angive det i samme fil, se f.eks. www.w3schools.com om hvordan du gør
Avatar billede ladyhawke Novice
05. marts 2009 - 15:30 #6
http://www.w3schools.com/css/css_mediatypes.asp (her nærmere bestemt)
Avatar billede mclemens Nybegynder
05. marts 2009 - 15:32 #7
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<link rel="stylesheet" href="css.css" type="text/css">
<link rel="stylesheet" href="print.css" type="text/css" media="print">

</head><body>
<div>jeg vil ikke printes..</div>
<div class="printes">jubii det virker</div>
<div>jeg vil ikke printes..</div>
</body></html>

og

print.css:
body * {display:none;}
.printes {display:block!important;}


eller


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<link rel="stylesheet" href="css.css" type="text/css">
<link rel="stylesheet" href="print.css" type="text/css" media="print">

</head><body>
<div class="noprint">jeg vil ikke printes..</div>
<div>jubii det virker</div>
<div class="noprint">jeg vil ikke printes..</div>
</body></html>

og

print.css:
.noprint {display:none;}
Avatar billede l_otto Nybegynder
05. marts 2009 - 15:39 #8
hmm det virker ikke den tager stadig det hele med
Avatar billede l_otto Nybegynder
05. marts 2009 - 15:41 #9
jo det gør sorry
Avatar billede l_otto Nybegynder
05. marts 2009 - 15:43 #10
men nu videre til den den helt frække...

nu er det jo bare en blank side den printer på .. jeg kunne godt tænke mig den lige kunne lægge til top logo image i toppen og firma tekst i bunden..


toplog


teksten der printes


---------------
footer firma-gaden 12 osv


Hvordan laver vi den
Avatar billede l_otto Nybegynder
05. marts 2009 - 15:51 #11
og den skal printe baggrundsfarven ud på mine tabeller :-)
Avatar billede zips Juniormester
05. marts 2009 - 15:53 #12
Husk default er udskrivning af baggrundsfarver og billder slået fra i printer opsætningen, så dem kan du ikke udskrive uden du gør brurgen opmærksom på dette og de slår det til.
Avatar billede l_otto Nybegynder
05. marts 2009 - 15:56 #13
øv det tænkte jeg nok, er der ikke en smart løsning på¨det
Avatar billede mclemens Nybegynder
05. marts 2009 - 16:00 #14
- Du definerer hvilke elementer der
ikke skal printes ud (display none).

- Du ligger baggrunden ind på det element du
udskriver eller det bagved liggende element.
- Du beder din bruger om at vælge filer ->
sideopsætning og afkrydse udskrivning af baggrunde.

eller

- Du laver et relativt placeret element.
- Placerer en img i dette element via f.eks.
position absolute på den placering du ønsker.
- Ovenpå dette element placerer du et nyt element
med teksten.
- Du læner dig tilbage og nyder at folk der
udskriver siden får baggrunden med uden at
du skal bede dem foretage ændringer.

Ulempen ved 1'eren er at baggrunden evt. mangler.
Ulempen ved 2'eren er at folk uden farve printer
måske ikke synes baggrunder ser fed ud og/eller at
folk måske ikke syntes at baggrunden var blækket værd.
Avatar billede l_otto Nybegynder
05. marts 2009 - 16:02 #15
ok tak jeg prøver...
Avatar billede mclemens Nybegynder
05. marts 2009 - 16:06 #16
eksempel:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>
</head><body>
<div style="height:65px;background:url('http://www.eksperten.dk/images/eksperten_logo.gif') no-repeat;">Hejsa</div>

vs.

<div style="position:relative;height:65px;"><img src="http://www.eksperten.dk/images/eksperten_logo.gif" style="position:absolute;"><div style="position:relative;">Hejsa</div></div>

eller

<div style="position:relative;"><img src="http://www.eksperten.dk/images/eksperten_logo.gif" style="position:absolute;z-index:-1;">Hejsa</div>
</body></html>
Avatar billede l_otto Nybegynder
05. marts 2009 - 16:08 #17
perfekt tak... kan jeg give print.css en fast baggrundsfarve?
Avatar billede mclemens Nybegynder
05. marts 2009 - 16:19 #18
Tjoh, du kan gøre noget i stil med:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<style type="text/css">
.onlyprint{display:none;}

@media print
{
.printes {display:block;}
.noprint {display:none;}
}
</style>


</head><body>
<div style="position:relative;height:65px;"><img class="noprint" src="http://www.eksperten.dk/images/eksperten_logo.gif" style="position:absolute;z-index:-1;"><img class="printes onlyprint" src="http://www.eksperten.dk/images/dot_3.gif" style="position:absolute;z-index:-1;">Hejsa</div>
<br><br>
<div style="position:relative;height:65px;"><img class="noprint" src="http://www.eksperten.dk/images/eksperten_logo.gif" style="position:absolute;z-index:-1;"><img class="printes onlyprint" src="http://www.eksperten.dk/images/dot_3.gif" style="position:absolute;z-index:-1;width:100%;height:100%;">Hejsa</div>
</body></html>


... Vær dog opmærksom på at du ikke "decideret*" kan tile baggrundsbilleder, men kun stretche dem eller bevarer deres oprindelige størrelse ved denne måde. Snakker vi om en ensfarvet baggrund burde det dog ikke være noget problem i et streche en 1x1 px billede til at fylde hele elementet.
*Der kan dog laves krumspring
Avatar billede mclemens Nybegynder
05. marts 2009 - 16:20 #19
@media print er fra LadyHawke's link
Avatar billede l_otto Nybegynder
05. marts 2009 - 16:23 #20
tak kom med et svar :-)
Avatar billede mclemens Nybegynder
05. marts 2009 - 16:23 #21
Er det blot en 1x1px baggrundsfarve billede der skal bruges kan det dog også laves via. border, hvis str. er kendt

<div style="position:relative;height:65px;"><img class="noprint" src="http://www.eksperten.dk/images/eksperten_logo.gif" style="position:absolute;z-index:-1;"><div class="onlyprint printes" style="position:absolute;z-index:-1;width:0;height:0;border-right:188px solid #f00;border-bottom:65px solid #f00;">Hejsa</div>
Avatar billede mclemens Nybegynder
05. marts 2009 - 16:25 #22
Super, fordel venligst point mellem ladyhawke og mig.
Hun svarede jo først på dit oprindelige spørgsmål ;)
- Og takker for point :)
Avatar billede l_otto Nybegynder
05. marts 2009 - 16:27 #23
OOKI
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel Indlæg Oprettet Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML 18 10/09/202515:07 17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML 3 19/03/202522:16 20/03/202513:04
Se og ændre html på en webside Af magger i HTML 4 11/03/202513:55 12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML 5 02/03/202520:05 04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML 3 30/10/202409:37 01/01/202515:27
Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
27/1222:02 Låse brugt iPad op Af drstein i iOS, iPhone & iPad
27/1219:21 Hvor finder jeg en oversigt over mine spørgsmål Af KurtG i Hjælp og fejl
27/1211:31 TP-Link Wifi extender opsat som accesspoint giver 50% up- og download, Af Uvanga i Wifi
26/1213:05 Hvorfor bliver tiff-filer større ved konvertering til samme format Af KurtG i Billedbehandling
23/1221:36 Gøre Ikonerne lidt større i proceslinjen (Windows 10) Af Ikke-ekspert i Windows
White papers
Flere white papers »