Pseudo elemnti se u css-u koriste kako bi sadržaju web stranice dodali neke specijalne efekte. Tako možemo odrediti kao će se prikazati samo prvo slovo, ili pak prva rečenica. Možemo i odrediti sadržaj koji će se uvijek pojavljivati nakon određenog sadržaja.
Osnovna sintaksa ide ovako:

selektor:pseudo element {svojstvo: vrijednost}

css klase se mogu kombinirati sa pseudo elementima, onda sintaksa izgleda ovako:

selector.class:pseudo element {svojstvo: vrijednost}

- sljedećim kodom možete odrediti kako će izgledati prvo slovo

p:first-letter {
color: #168ecd;
font-size: 20px;
font-weight: bold;
}

- u pregledniku to izgleda ovako:

Ovo je probna rečenica

- sljedeći popis vam pokazuje koja svojstva može sadržavati ovaj pseudo element

font properties
color properties
background properties
margin properties
padding properties
border properties
text-decoration
vertical-align (samo ako ne postoji float)
text-transform
line-height
float
clear

- sljedeći će kod prvu rečenicu učiniti drugačijom od ostalih

p:first-line {
color: #168ecd;
font-size: 8px;
}

- kod će biti prikazan ovako:

Ovo je rečenica koja
se lomi da bi vidjeli željeni efekt.

- gornji pseudo class može sadržavati sljedeća svojstva:

font properties
color properties
background properties
word-spacing
letter-spacing
text-decoration
vertical-align
text-transform
line-height
clear

- pseudo elementima možemo, kao što sam i prije spomenuo odrediti sadržaj koji će se uvijek pojavljivati prije ili poslije nekog elementa, kod izgleda ovako:

h4:before {
content: "- ";
}
h4:after {
content: " -";
}

- to izgleda ovako:

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 - 2009, tutoriali.biz