Kako bi stvorili efektivniiji dizajn, možemo koristit css i njegovo svojstvo opacity. Nažalost, sintagma nije ista za sve preglednike pa ćete morati pisati kod u različitim varijantama kako bi vaš dizajn bio jednako prikazan u svim pregeldnicima.

Za određivanje prozirnosti Mozilla koristi ssvojstvo -moz-opacity:x, gdje je x vrijednost od 0.0 do 1.0. IE koristi filter:alpha(opacity=x), gdje je x vrijednost od 0 do 100. Za određivanje prozirnosti postoji i svojstvo koje koristi CSS3, ali ono još nije podržano od strane preglednika.

Sada ću vam pokazati kako to izgleda u praksi. Napravit ću jedan div koji će sadržavati neku sliku kao pozadinu. Unutar tog diva ću smjestiti drugi div koji će kao opozadinu koristiti neku boju kojoj ću promijeniti prozirnost.

Kod izgleda ovako:

#pozadina {
width: 200px;
height: 160px;
background-image: url('slika_tutorial.gif');
border: 1px solid #000;
}
#prozirni_dio {
width: 150px;
height: 150px;
margin: auto;
background-color: #ffffff;
border: 1px solid #000;
/* za IE */
filter:alpha(opacity=40);
/* CSS3 */
opacity:0.4;
/* za Mozillu */
-moz-opacity:0.4;
}
#prozirni_dio p {
margin: auto;
color: #000;
}

Preglednik će to ovako prikazati:

Ovo je samo probni tekst. Ovo je samo probni tekst. Ovo je samo probni tekst. Ovo je samo probni tekst.

Navigacija
Korisni linkovi
Kratke vijesti
Vodafone lansirao mobilni glazbeni servis

Kako bi što lakše komunicirala sa svojim polaznicima, koji su mahom vrlo mladi i skloni komunikaciji preko suvremenih društvenih mreža NetAkdemija se odlučila pridružiti najvećoj online zajednici.NetAkademija Tehničkog veleučilšta u Zagrebu...

više na pcchip.hr

Vic dana
Anketa
copyright© 2006 - 2008, tutoriali.biz