Lucrul cu imaginile de fundal in HTML.

Majoritatea utilizatorilor care acceseaza o pagina de pe site-ul tau nu vor putea printa logo-urile pentru ca imaginile de fundal nu sunt afsate de obicei. Tehnica rapida si simpla care vei face ca imaginea sa apara la imprimare este:

HTML:

<h1 id="logo">Site Name</h1>

CSS:

h1#logo { 
    background: url(images/logo.gif); 
    height: 75px; 
    width: 137px; 
    text-indent: -9999px; 
}

Aceasta se va vedea bine intr-un layout normal, dar logo-ul va disparea cand pagina este printata. Pentru a rezolva aceasta problema, trebuie sa punem imaginea pe pagina cu HTML si sa folosim stylesheet-uri screen si print.

HTML:

<h1 id="logo">Site Name</h1>
<img src="images/logo.gif" alt="Site Name" class="nodisplay" />

Screen CSS:

h1#logo { 
    background: url(images/logo.gif); 
    height: 75px; 
    width: 137px; 
    text-indent: -9999px; 
}
img.nodisplay { display: none; }

Print CSS:

h1#logo { display: none; }
img.nodisplay { display: block; }

Tocmai am ascuns imaginea pentru cititoarele de ecran si am substituit-o cu o imagine "reala" pentru logo-ul de fundal pentru imprimare. Poti sa faci asta pentru fiecare imagine de fundal care vrei sa apara la imprimare de pe pagina, desi nu este foarte eficient pentru fundaluri cu gradient si sabloane.

• I. Ce inseamna HTML?
• 6 Metode Simple pentru a-ti imbunatati e-mailurile HTML
• VIII. Tabele
• III. Fonturi si tag-urile font
• Div-uri versus tabele