Sadržaj
Ovim elementima ili izbornicima može se manipulirati pomoću Jqueryja i css -a za stvaranje efekata i dobivanje sadržaja, sakrivanje ili dodavanje i primjenu određenog učinka na njih, olakšavajući rad programerima. Neki su birači poznatiji po css kodu, na primjer:IDENTIFIKATORI
Oni su element najviše hijerarhije i definiraju opće parametre za elemente bloka. Definirani su kao #id i obično se primjenjuju na popise ili blokove.
Ovo je birač id paragrafa
Odlomak bez birača
LEKCIJE
Oni su elementi niže hijerarhije i koriste se za pojedinačne elemente ili za definiranje klasa unutar identifikacije, kao što su:
Ovo je birač id paragrafa
Plavi odlomak sa str
Plavi odlomak s divCrveni odlomak s div
Iako neovisna klasa .parrafoazul može primijeniti element p koji ne ovisi o nikome, možemo ga primijeniti čak i na druge elemente, kao što je div, no ako pokušamo primijeniti klasu parraforojo neovisno o identifikatoru #paragraph, vidjet ćemo da to čini ne radi jer ne ispunjava hijerarhiju koja nameće njegov identifikator #paragraf.
Ovdje možemo koristiti mnoge selektore, neke ćemo vidjeti
Parni (parni) i neparni (neparni) izbornik
Ovaj se izbornik primjenjuje na niz elemenata koji koriste istu klasu i može utjecati na parne ili neparne elemente, na primjer bojimo pozadinu popisa odlomaka.
STAVCI
Korisnik 1 je ostavio poruku
Korisnik 2 je ostavio poruku
Korisnik 3 je ostavio poruku
Korisnik 4 je ostavio poruku
UL LIST
- Korisnik 1 je ostavio poruku
- Korisnik 2 je ostavio poruku
- Korisnik 3 je ostavio poruku
- Korisnik 4 je ostavio poruku
BIRAČ PRVI (prvi) i POSLEDNJI (posljednji)
Ovi nam izbornici omogućuju manipulaciju prvim i posljednjim elementom određenog popisa, na primjer popis postavljamo sivom bojom, prvi element zelenom, a posljednji element plavom bojom.
UL LIST
- Korisnik 1 je ostavio poruku
- Korisnik 2 je ostavio poruku
- Korisnik 3 je ostavio poruku
- Korisnik 4 je ostavio poruku
FOKUSNI SELEKTOR
Fokus na element aktivira se kad kliknete na element i deaktivira se kada kliknete na drugo područje weba ili na drugi element. Vidjet ćemo primjer s obrascem za prijavu, stvaramo klasu .focologin, a zatim je primjenjujemo na identifikator obrasca #login kako bismo utjecali na sve elemente koje sadrži. Također ga možemo primijeniti na sloj ili div blok i postaviti obrazac unutar bloka.
OBLIK
Korisnička lozinka:
Dodijelite ili promijenite css stil elementu pomoću AddClass
Ako želimo dinamički dodijeliti css stil ili promijeniti prema nekom utvrđenom uvjetu, koristit ćemo AddClass. U ovom slučaju imamo .green gumb klase i tekstu tipa unosa dodjeljujemo .box box klase iz Jqueryja. To ne utječe na unos vrste lozinke niti na gumb za slanje jer im nismo dodijelili nijednu klasu css.
UPISNICA
Ime:
Adresa:
Telefon:
E-mail:
Ovaj izbornik omogućuje identifikaciju elementa niza elemenata prema položaju u kojem se nalazi tablična ćelija, na primjer. Moramo imati na umu da su elementi navedeni kao indeksi matrice koja počinje s 0,1,2 itd. .
| Naslov A | Naslov B | Naslov C |
|---|---|---|
| Ćelija 0 | Ćelija 1 | Ćelija 2 |
| Ćelija 3 | Ćelija 4 | Ćelija 5 |
Nastavljajući s tablicama i primjenom birača, vidjet ćemo kako stvoriti pozadinski dizajn na naizmjeničan način u bojama redaka tablice, slično onome što je prethodno primjenjivano s odlomcima i popisima. Ne dodajemo toliko css -a ili dizajna kako bi se efekt u osnovi bolje cijenio.
SELEKTOR n-dijete
Nastavljajući s prethodnim primjerom, možemo upotrijebiti selektor n -tog djeteta kao nadopunu, slično izborniku eq, ali razlika je u tome što se s n-tim djetetom položaji mogu označiti u obliku aritmetičke operacije. Koristi se za odabir jednog ili više elemenata, ali uz uvjet da je to n -to dijete svog roditelja. Ovaj birač je koristan za odabir drugog odlomka bloka ili treće stavke popisa itd. Elementi se ne uzimaju kao niz već redom prvi, drugi itd.
Na primjer, ako u prethodnoj skripti dodamo
U ovom slučaju bit će odabrani neparni stupci
- Neparni stupci nth-child (2n + 1)
- Upareni stupci nth-child (2n)
- Prvi i četvrti stupac nth-child (3n + 1)
