CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg
Cookie ikon
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 I går 15: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
I dag 12:55 Oneplus bloototh Af johnnylassen i Andet netværk
I går 15:05 Excel ark oplåsning Af FinnLauridsen i Excel
I går 13:39 Postman Af OBS i Andet software
16/0911:19 Google maps - downloaded - samlet overblik? Af 1Dorte i Andet software
15/0913:51 Smarthome system Af Vesterlund i Andet hardware
White papers
Flere white papers »


Premium
Teaser billede
Nyder godt af kæmpe blodbad i Broadcoms netværk af VMware-partnere
Læs mere »
Sådan har TDC Erhverv udviklet den sikre data-motorvej ind i Danmarks nye AI-supercomputer: Har taget blot tre måneder
Tidligere Ecco-CIO Ulrik Balling Hansen lander internationalt topjob
LA, SF og erhvervslivet er enige: Sådan opnår Danmark digital suverænitet
Se alle »
Computerworld
Teaser billede
I aften sker det: Din iPhone får en monumental opdatering
Læs mere »
Apples nye AirPods Pro 3 er proppet med nyt – nu er det meget mere end nogle høretelefoner
Microsoft tvangsinstallerer app i din Office 365 i næste måned: Du kan ikke slippe
Alt om Apples store opdatering til iPhone, Mac, Watch og iPad
Se alle »
CIO
Teaser billede
Til kamp mod legacy og teknisk gæld: Uffe har skrottet 200 servere og 1.000 routere og switches på 140 lokationer
Læs mere »
Microsoft opsplitter Office og Teams: Sådan fungerer opdelingen
Overgangen til Windows 11 kan udløse store bøder, hvis du ikke passer på
”Det fylder helt oppe på direktionsgangene:" Danske topkonsulenter løfter sløret for det allervigtigste it-tema lige nu
Se alle »
Job & Karriere
Teaser billede
Tryg skiller sig af med 225 it-medarbejdere: Outsourcer stor del af sin it-drift til indere
Læs mere »
Lille dansk it-virksomhed fra Vanløse lander drømmekontrakt, der rækker langt ind i stifterens pension
Her er fidusen: Sådan fastholder KMD og Twoday deres it-folk i lang tid
Novo Nordisks CIO og digitale topchef, Anders Romare, forlader selskabet
Se alle »
White paper
Teaser billede
Sådan får du succes med AI i hele organisationen
Læs mere »
Revolutionér kundeoplevelsen med AI og automatisering
Sådan får du succes med AI i hele organisationen
Specialister med særlige evner: Din skjulte konkurrencefordel
Se alle »

Events
Flere events »
White papers
Flere white papers »
IT-Kurser
Se alle vores it-kurser »