Avatar billede zentral Nybegynder
10. oktober 2010 - 17:49 Der er 7 kommentarer og
1 løsning

Print baggrund

Jeg har problemer med at udskrive et billede som er brugt som baggrund i en tabel.
Jeg har læst en del om at browsere fjerner baggrundsbillederne når man bruger udskriv, det er dog i mit tilfælde nødvendigt, så håber der er en som kender et smart trick :)

Jeg vil gerne udskrive denne tabel, med baggrunds billede.
Billedet som er brugt er langt, men begrænses af størrelsen på indholdet.

Hvordan kan man lige fixe det ?

<TABLE STYLE="background-image: url(Background.jpg);">
<TR>
  <TD STYLE="MIN-HEIGHT: 150px;"> Bla,Bla,Bla... </TD>
</TR>
</TABLE>
Avatar billede w13 Novice
10. oktober 2010 - 17:59 #1
Det er korrekt, at de fleste browsere som standard ikke udskriver baggrunde, og det kan du desværre ikke kode dig fra, så vidt jeg ved. Dine brugere kan dog slå det til selv i deres browsere.

Alternativt må du sørge for at indsætte det som rigtige billeder, der er skjult normalt, men aktiveres vha. et print-stylesheet.
Avatar billede zentral Nybegynder
10. oktober 2010 - 18:10 #2
Okay ja har også læst lidt om det, men har ikke kunne få det print-stylesheet til at fungere.

Kan du fortælle mig hvordan det virker, til mit eksempel?
Avatar billede w13 Novice
10. oktober 2010 - 18:18 #3
Du kan tilføje et ekstra stylesheet med særlige CSS-regler, der kun bruges ved udprint. Det gøres fx. med linjen:

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

Hvis du gør det sådan, burde det virke. Så kan du overskrive værdier fra dit andet stylesheet og evt. tilføje nye.
Avatar billede w13 Novice
10. oktober 2010 - 18:22 #4
Hvis du har dit baggrund liggende som billede sådan her:

<div style="background: url(baggrund.jpg);">
    <img class="print-background" src="baggrund.jpg" />
    Tekst
</div>


Så kan dit normale stylesheet have:

.print-background {
    display: none;
}


Og dit print-stylesheet kan have noget i stil med:

.print-background {
    display: block !important;
    z-index: -1;
  position: relative;
}


Det er dog pseudo-kode, dvs. utestet. =) Men noget i den tankegang burde kunne klare det!
Avatar billede w13 Novice
10. oktober 2010 - 18:22 #5
Måske:

display: inline !important;


og ikke:

display: block !important;
Avatar billede zentral Nybegynder
13. oktober 2010 - 16:03 #6
Det virkede ret godt, post et svar og du får dine velfortjente points...

Mange tak for hjælpen.
Avatar billede w13 Novice
13. oktober 2010 - 16:07 #7
Selv tak. :)
Avatar billede w13 Novice
13. oktober 2010 - 16:18 #8
Tak for point! :)
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
Vi tilbyder markedets bedste kurser inden for webudvikling

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.

Du kan også logge ind via nedenstående tjenester