CSS (Cascading Style Sheets) ili Cascading Style Sheets koriste se za opisivanje izgled dokument napisan u jeziku za označavanje. Obično se CSS stilovi koriste za stvaranje i modificiranje stila elemenata web stranice i korisničkih sučelja napisanih HTML jezici i XHTML, ali se također može primijeniti na bilo koju vrstu XML dokumenta, uključujući XML, SVG i XUL.

Kaskadni listovi stilova opisuju pravila za oblikovanje elemenata pomoću svojstava i prihvatljive vrijednosti ova svojstva. Za svaki element možete koristiti ograničeni skup svojstava, ostala svojstva neće imati nikakav utjecaj na njega.

Deklaracija stila sastoji se od dva dijela: element web stranice - selektor, a naredbe za oblikovanje su - oglasni blok... Selektor govori pregledniku koji element treba formatirati i u oglasnom bloku (kod u kovrčave zagrade) navodi naredbe za oblikovanje - svojstva i njihove vrijednosti.

Vrste kaskadnih stilskih tablica i njihove specifičnosti

1. Vrste stilskih tablica

1.1. Vanjski stilski list

Vanjski stilski list predstavlja tekstualnu datoteku css proširenje, koje sadrži skup elemenata u CSS stilu. Datoteka se kreira u uređivaču koda, baš kao i HTML stranica. Datoteka može sadržavati samo stilove, bez HTML oznake. Vanjski stilski list povezan je s web-stranicom pomoću oznake nalazi unutar odjeljka ... Ovi stilovi funkcioniraju za sve stranice na web mjestu.

Više stilskih tablica može se priložiti svakoj web stranici dodavanjem više oznaka u nizu određivanjem svrhe ovog stilskog lista u atributu medijske oznake. rel = "stylesheet" označava vrstu veze (veza stilskog lista).

Atribut type = "text / css" nije obavezan u HTML5 standardu i može se izostaviti. Ako je atribut odsutan, zadana vrijednost je type = "text / css".

1.2. Interni stilovi

Interni stilovi ugrađen u odjeljak HTML dokument i definirani su unutar oznake... Unutarnji stilovi imaju prednost nad vanjskim stilovima, ali su inferiorni u odnosu na inline stilove (navedene pomoću atributa stila).

...

1.3. Umetnuti stilovi

Kad pišemo umetnuti stilovi, pišemo CSS kod u HTML datoteku, izravno unutar oznake elementa pomoću atributa style:

Obratite pažnju na ovaj tekst.

Ovi stilovi utječu samo na element za koji su specificirani.

1.4. @Pravilo uvoza

@Pravilo uvoza omogućuje učitavanje vanjskih stilova. Da bi direktiva @import funkcionirala, mora se pojaviti u tablici stilova (vanjski ili interni) prije svih ostalih pravila:

Pravilo @import također se koristi za uključivanje web fontova:

@import url (https://fonts.googleapis.com/css?family=Open+Sans&subset=latin,cyrillic);

2. Vrste selektora

Selektori predstavljaju strukturu web stranice. Koriste se za stvaranje pravila za oblikovanje elemenata web stranice. Selektori mogu biti elementi, njihove klase i identifikatori, kao i pseudoklase i pseudoelementi.

2.1. Univerzalni selektor

Odgovara bilo kojem HTML elementu. Na primjer, * (margina: 0;) poništit će margine za sve elemente web mjesta. Također, selektor se može koristiti u kombinaciji s pseudo-klasom ili pseudo-elementom: *: poslije (CSS stilovi), *: označeno (CSS stilovi).

2.2. Birač elemenata

Selektori elemenata omogućuju formatiranje svih elemenata ovog tipa na svim stranicama stranice. Na primjer, h1 (familija fontova: Jastog, cursive;) će postaviti opći stil oblikovanja za sve naslove h1.

2.3. Selektor razreda

Selektori klasa omogućuju vam stiliziranje jednog ili više elemenata isto ime razred postavljen na različita mjesta na stranici ili na različite stranice mjesto. Na primjer, da biste stvorili naslov s klasom naslova, dodajte atribut klase s naslovom vrijednosti u početnu oznaku

i postaviti stil za navedenu klasu. Stilovi stvoreni klasom mogu se primijeniti na druge elemente, ne nužno ovog tipa.

Upute za korištenje osobno računalo

2.4. Selektor identifikatora

ID birač omogućuje formatiranje jedan specifična stavka. ID mora biti jedinstven i može se pojaviti samo jednom na jednoj stranici.

2.5. Selektor potomaka

Selektori potomaka primjenjuju stilove na elemente unutar elementa spremnika. Na primjer, ul li (transformacija teksta: velika slova;) će odabrati sve li elemente koji su potomci svih ul elemenata.

Ako želite formatirati potomke određenog elementa, morate postaviti klasu stila za taj element:

p.prvi a (boja: zelena;) - zadanog stila primjenjivat će se na sve veze koje su potomci odlomka s prvom klasom;

p .first a (boja: zelena;) - ako dodate razmak, onda će veze koje se nalaze unutar bilo koje oznake klase .first, koja je dijete elementa, biti stilizirane

Prvo a (boja: zelena;) - ovaj stil će se primijeniti na bilo koju vezu koja se nalazi unutar drugog elementa označenog od strane .first class.

2.6. Selektor djece

Podređeni element je izravno dijete elementa koji ga sadrži. Jedan element može imati nekoliko dječji elementi, a svaki element može imati samo jedan roditeljski element. Podređeni selektor omogućuje vam primjenu stilova samo ako podređeni element odmah slijedi roditeljski element i između njih nema drugih elemenata, odnosno dijete više nije ugniježđeno ni u čemu.
Na primjer, p> strong će odabrati sve jake elemente koji su podređeni elementu p.

2.7. Sestra selektorica

Sestrinski odnos nastaje između elemenata sa zajedničkim roditeljem. Selektori braće i sestara omogućuju vam odabir stavki iz grupe braće i sestara.

h1 + p - će odabrati sve prve odlomke odmah nakon bilo koje oznake

bez utjecaja na ostale odlomke;

h1 ~ p - odabire sve paragrafe koji su braća i sestre bilo kojem h1 naslovu i odmah nakon njega.

2.8. Selektor atributa

Selektori atributa odabiru elemente na temelju naziva atributa ili vrijednosti atributa:

[attribute] - svi elementi koji sadrže navedeni atribut - svi elementi za koje je postavljen alt atribut;

selector [attribute] - elementi ovog tipa koji sadrže navedeni atribut, img - samo slike za koje je postavljen alt atribut;

selektor [attribute = "value"] - elementi ovog tipa koji sadrže navedeni atribut s određenom vrijednošću, img - sve slike čiji nazivi sadrže riječ cvijet;

selektor [attribute ~ = "vrijednost"] - elementi koji djelomično sadrže zadanu vrijednost, na primjer, ako je nekoliko klasa navedeno za element odvojen razmakom, p - odlomci, čiji naziv klase sadrži značajku;

selektor [attribute | = "value"] - elementi čiji popis vrijednosti atributa počinje navedenom riječju, p - odlomci čiji je naziv klase značajka ili počinje značajkom;

selektor [attribute ^ = "value"] - elementi čija vrijednost atributa počinje navedenom vrijednošću, a - sve veze koje počinju s http: //;

selektor [attribute $ = "value"] - elementi čija vrijednost atributa završava navedenu vrijednost, img - sve slike u png formatu;

selektor [attribute * = "value"] - elementi čija vrijednost atributa sadrži navedenu riječ bilo gdje, a - sve veze čiji naziv sadrži knjigu.

2.9. Pseudo selektor klase

Pseudo-klase su klase koje zapravo nisu vezane uz HTML oznake. Omogućuju vam primjenu CSS pravila na elemente na događaju ili submissive određeno pravilo... Pseudo-klase karakteriziraju elemente sa sljedećim svojstvima:

: lebdjeti - bilo koji element iznad kojeg lebdi kursor miša;

: fokus - interaktivni element do kojeg je navigirano pomoću tipkovnice ili aktiviran pomoću miša;

: active - element koji je aktivirao korisnik;

: valid - polja obrasca čiji je sadržaj provjeren u pregledniku na usklađenost s navedenom vrstom podataka;

: invalid - polja obrasca čiji sadržaj ne odgovara navedenoj vrsti podataka;

: omogućeno - sva aktivna polja obrasca;

: disabled - onemogućena polja obrasca, tj. u neaktivnom stanju;

: u rasponu - polja obrasca čije su vrijednosti u navedenom rasponu;

: izvan raspona - polja oblika čije vrijednosti nisu uključene u navedeni raspon;

: lang () - elementi s tekstom na navedenom jeziku;

: not (selektor) - elementi koji ne sadrže navedeni selektor - klasu, identifikator, naziv ili tip polja obrasca -: not ();

: cilj - element sa simbolom # koji se referencira u dokumentu;

: označeno - odabrani (odabrano od strane korisnika) elementi obrasca.

2.10. Strukturni selektor pseudoklasa

Strukturne pseudoklase odabiru djecu prema parametru navedenom u zagradama:

: nth-child (odd) - neparna djeca;

: nth-dijete (parno) - parna djeca;

: nth-child (3n) - svaki treći element među djecom;

: nth-child (3n + 2) - odabire svaki treći element počevši od drugog djeteta (+2);

: nth-child (n + 2) - odabire sve elemente počevši od drugog;

: nth-child (3) - odabire treće dijete;

: nth-last-child () - na popisu djece odabire element s navedeno mjesto, slično: nth-child (), ali počevši od posljednjeg u suprotnom smjeru;

: first-child - omogućuje vam stiliziranje samo prvog djeteta oznake;

: last-child - omogućuje formatiranje posljednjeg podređenog elementa oznake;

: only-child - odabire element koji je jedino dijete;

: prazno - odabire elemente koji nemaju djece;

: root - odabire element koji je korijen dokumenta - html element.

2.11. Selektor pseudoklasa strukturnog tipa

Označava određenu vrstu podređene oznake:

: nth-of-type () - odabire elemente po analogiji s: nth-child (), uzimajući u obzir samo tip elementa;

: first-of-type - odabire prvo dijete zadanog tipa;

: last-of-type - odabire posljednji element ovog tipa;

: nth-last-of-type () - odabire element dati tip u popisu stavki prema navedenom mjestu, počevši od kraja;

: only-of-type - Odabire jedini element navedene vrste među djecom roditeljskog elementa.

2.12. Pseudo selektor elemenata

Pseudoelementi se koriste za dodavanje sadržaja koji se generira pomoću svojstva sadržaja:

: prvo slovo - odabire prvo slovo svakog odlomka, odnosi se samo na blok elemente;

: first-line - odabire prvi redak teksta elementa, odnosi se samo na blok elemente;

: before - umeće generirani sadržaj prije elementa;

: poslije - dodaje generirani sadržaj nakon elementa.

3. Kombinacija selektora

Za precizniji odabir elemenata za oblikovanje možete koristiti kombinacije selektora:

img: nth-of-type (paran) - odabire sve parne slike, alternativni tekst koji sadrži riječ css.

4. Grupiranje selektora

Isti stil se može primijeniti na više elemenata u isto vrijeme. Da biste to učinili, na lijevoj strani deklaracije navedite potrebne selektore odvojene zarezima:

H1, h2, p, raspon (boja: rajčica; pozadina: bijela;)

5. Nasljeđivanje i kaskada

Nasljeđivanje i kaskada dva su temeljna koncepta u CSS-u koji su usko povezani. Nasljeđivanje znači da elementi nasljeđuju svojstva od svog roditelja (elementa koji ih sadrži). Kaskada se očituje u načinu različiti tipovi stilski listovi se primjenjuju na dokument i kako sukobljena pravila nadjačavaju jedno drugo.

5.1. Nasljedstvo

Nasljedstvo je mehanizam kojim se određena svojstva prenose s pretka na njegove potomke. CSS specifikacija osigurava nasljeđivanje svojstava vezanih uz tekstualni sadržaj stranice, kao što su boja, font, razmak između slova, visina reda, stil liste, poravnanje teksta, uvlaka teksta, transformacija teksta, vidljivost, bijela -razmak i razmak riječi. To je zgodno u mnogim slučajevima jer ne morate postavljati veličinu fonta i obitelj fontova za svaki element na web stranici.

Svojstva oblikovanja bloka se ne nasljeđuju. To su pozadina, obrub, prikaz, plutajući i čisti, visina i širina, margina, min-max-visina i -širina, obris, preljev, padding, položaj, dekoracija teksta, okomito poravnavanje i z-indeks.

Prisilno nasljeđivanje

Preko ključna riječ naslijediti Možete prisiliti element da naslijedi bilo koju vrijednost svojstva od nadređenog elementa. Ovo čak funkcionira i za svojstva koja se prema zadanim postavkama ne nasljeđuju.

Kako su CSS stilovi postavljeni i funkcioniraju

1) Stilovi se mogu naslijediti od roditeljskog elementa (naslijeđena svojstva ili korištenjem naslijeđene vrijednosti);

2) Stilovi koji se nalaze u donjoj tablici stilova nadjačavaju stilove koji se nalaze u gornjoj tablici;

3) Jedan element se može stilizirati različiti izvori... Možete provjeriti koji se stilovi primjenjuju u modu razvojnog programera preglednika. Da biste to učinili, kliknite iznad elementa. desni klik miša i odaberite "View Code" (ili nešto slično). Desni stupac će navesti sva svojstva koja su postavljena za ovaj element ili naslijeđena od nadređenog elementa, kao i stilske datoteke u kojima su navedena, i serijski broj linije koda.

4) Prilikom definiranja stila možete koristiti bilo koju kombinaciju selektora - selektor elementa, pseudo-klasa elementa, klasa ili identifikator elementa.

5.2. Kaskada

Kaskadno Je mehanizam koji kontrolira krajnji rezultat kada se različita CSS pravila primjenjuju na isti element. Postoje tri kriterija koji određuju redoslijed primjene svojstava - važno pravilo, specifičnost i redoslijed u kojem su stilski listovi uključeni.

Važno pravilo

Težina pravila može se postaviti pomoću ključne riječi! Važno, koja se dodaje odmah iza vrijednosti svojstva, na primjer, raspon (težina fonta: podebljano! Važno;). Pravilo se mora staviti na kraj deklaracije, prije završne zagrade, bez razmaka. Takva objava imat će prednost nad svim ostalim pravilima. Ovo pravilo vam omogućuje da poništite vrijednost svojstva i postavite novu za element iz grupe elemenata u slučaju kada nema Direktni pristup u datoteku sa stilovima.

Specifičnost

Za svako pravilo, preglednik izračunava specifičnost selektora a ako element ima proturječne deklaracije svojstva, uzima se u obzir pravilo s najvećom specifičnošću. Vrijednost specifičnosti ima četiri dijela: 0, 0, 0, 0. Specifičnost selektora određena je na sljedeći način:

za id dodajte 0, 1, 0, 0;
0, 0, 1, 0 se dodaje za klasu;
0, 0, 0, 1 dodaje se za svaki element i pseudoelement;
za inline stil dodan izravno elementu - 1, 0, 0, 0;
univerzalni selektor nema specifičnosti.

H1 (boja: svijetloplava;) / * specifičnost 0, 0, 0, 1 * / em (boja: srebrna;) / * specifičnost 0, 0, 0, 1 * / h1 em (boja: zlatna;) / * specifičnost: 0, 0, 0, 1 + 0, 0, 0, 1 = 0, 0, 0, 2 * / div # glavna stranica (boja: plava;) / * specifičnost: 0, 0, 0, 1 + 0 , 1, 0, 0 + 0, 0, 0, 1 + 0, 0, 1, 0 = 0, 1, 1, 2 * / .bočna traka (boja: siva;) / * specifičnost 0, 0, 1, 0 * / #bočna traka (boja: narančasta;) / * specifičnost 0, 1, 0, 0 * / li # bočna traka (boja: aqua;) / * specifičnost: 0, 0, 0, 1 + 0, 1, 0, 0 = 0, 1, 0, 1 * /

Kao rezultat toga, ta će se pravila primijeniti na element čija je specifičnost veća. Na primjer, ako stavka ima dvije specifičnosti s vrijednostima 0, 0, 0, 2 i 0, 1, 0, 1, onda drugo pravilo pobjeđuje.

Redoslijed priloženih tablica

Možete stvoriti više vanjskih listova stilova i povezati ih na jednu web stranicu. Ako u različite tabliceću upoznati različita značenja svojstva jednog elementa, tada će se kao rezultat na element primijeniti pravilo koje se nalazi u stilskoj tablici na popisu ispod.

Čak i prije 1998., kada se pojavila specifikacija CSS razine 2, elementi obrasca su već bili široko podržani u svim glavnim preglednicima. CSS 2 specifikacija tek treba odgovoriti na pitanje kako se elementi obrasca trebaju predstaviti korisnicima. Budući da su elementi forme dio korisničko sučelje u svakom web dokumentu, autori specifikacije su odlučili otići vizualna prezentacija html elementi obrasca prema zadanim postavkama za svaki preglednik.

Tijekom godina, nedostatak detalja u specifikaciji u vezi s elementima obrasca prisilio je programere na stvaranje veliki broj testove i primjere, čija je glavna zadaća bila dovesti vizualne komponente svih elemenata oblika u jedan cross-browser izgled. U ovom članku ćemo pogledati neke CSS predlošci koji će vam omogućiti da elemente oblika dovedete u jedan zajednički nazivnik.

Testovi Rogera Johanssona za oblikovanje elemenata oblika

Još 2004., a zatim 2007., Roger Johansson kreirao je prilagođene testne pakete za elemente obrasca i CSS. Iz ovih testova proizašao je jedan zaključak koji je uznemirio Rogera:

Dakle, što je eksperiment pokazao? Kao što sam već napomenuo, testovi su pokazali da s koristeći CSS nije moguće kontrolirati stilove obrazaca kako bi se elementi obrasca prikazali istim na svim preglednicima i platformama. Testovi su također pokazali da većina preglednika zanemaruje mnoga CSS svojstva kada se primjenjuju na elemente obrasca stila.

Unatoč nepobitnoj istinitosti ovih nalaza, web programeri nastavljaju eksperimentirati CSS elementi forme u potrazi za Svetim gralom, ili barem razumnim kompromisom između zadanog prikaza preglednika i izvornog stila.

Zadani model prikaza za elemente obrasca

Prema zadanim postavkama, specifikacija CSS 2.1 za HTML4 postavlja način prikaza umetnutih blokova za elemente obrasca kao što su polje teksta, unos i odabir:

Područje teksta, unos, odabir (prikaz: inline-block;)

Obrnuto, elementi obrasca i skupa polja imaju način prikaza blokova:

Skup polja, obrazac (prikaz: blok;)

Model CSS specifikacije za stiliziranje elemenata u obrascima završava u ovom koraku. Svi ostali aspekti vizualnog prikaza elemenata obrasca ovise o zadanoj tablici stilova preglednika. Međutim, gornja pravila znače sljedeće:

• Elementi umetnutih blokova mogu se stilizirati korištenjem konteksta umetnutog oblikovanja. Iz čega slijedi koristeći CSS svojstva kao što su line-height i vertical-align za kontrolu visine elementa i vertikalnog poravnanja. Svojstva paddinga i margine također se mogu primijeniti za kontrolu internih i vanjski padding za elemente oblika. Vrijedi napomenuti da se inline-blok elementi također mogu kontrolirati pomoću širine i visine, njihovo ponašanje u tom pogledu ne razlikuje se od običnih blok elemenata.
• Elementi bloka mogu se stilizirati na standardan način korištenjem normalnog konteksta oblikovanja bloka. Međutim, postoje problemi s elementima obrasca skupa polja i legende jer se oni u potpunosti oslanjaju na stilove samog preglednika.

Postavlja se pitanje kako programeri rješavaju te probleme?

Rješavanje problema s veličinom elemenata forme

Web programeri su ubrzo vidjeli da preglednici rukuju inline-blok elementima na prilično čudan način kada je u pitanju njihova veličina. Određivanje visine često dovodi do neočekivanih rezultata:

Unos, odabir (širina: 120px; visina: 32px;)

Programeri su pokušali riješiti ovaj problem pomoću inline-bloka:

Unos, odabir (širina: 120px; visina: 32px; zaslon: blok;)

Rezultati su još uvijek loši s izuzetkom elementa textarea. Da biste riješili ovaj problem, prvo morate normalizirati font i veličinu fonta za elemente obrasca:

Unos, odabir (širina: 120px; font: 1em Arial, sans-serif;)

Nakon što je font instaliran, možete dodati uvlačenje:

Unos, odabir (širina: 120px; font: 1em Arial, sans-serif; padding: 3px 6px;)

Elementima unosa i textarea također se može dati obrub, što će utjecati na njihove dimenzije prema modelu okvira:

Input, input, textarea (rub: 1px solid #ccc;)

Ulazni elementi tipke tipke i submit preglednik može dodati dodatni padding. Uobičajena praksa je njihova normalizacija:

Unos, unos (ispun: 2px;)

Problem s ovim pristupom je što preglednici često primjenjuju prefikse dobavljača na svojstva elementa, tako da nije uvijek moguće normalizirati padding. Na primjer, za web-kit, možete normalizirati ovako:

Input, input, input, input :: - webkit-file-upload-button, button (-webkit-box-align: center; text-align: center; kursor: default; color: buttontext; padding: 2px 6px 3px; obrub : 2px početni gumb; obrubna slika: početna; boja pozadine: lice gumba; veličina okvira: rubna kutija;) ulaz, unos, unos (-webkit-appearance: pritisni gumb; razmak: pre;)

Padding također radi na elementima skupa polja i legende, ali s različitim rezultatima:

• Postavljanje dopuna skupa polja na 0 vraća zadani padding samo u nekim preglednicima (ne u IE)
• Postavljanje dopuna legende na 0 uzrokuje smanjenje tog elementa

Odaberite, potvrdni okvir, radio elementi mogu se normalizirati s dobrim rezultatima samo za nekoliko svojstava:

• Obitelj fontova
• Veličina fonta
• Širina (za odabir)
• Podstava

Primjena drugih svojstava na ove elemente oblika daje nedosljedne rezultate.

Poravnavanje stavki u obrascima

Elementi obrasca mogu se poravnati okomito i vodoravno. Mogu se nalaziti na istoj liniji ili u grupi. Da biste ih poravnali na istoj liniji, možete koristiti float ili standardni inline-blok kontekst.

Kada koristite plutajuće elemente, elementi se automatski pakiraju u okvir. To znači da sada postoji još devet pravila okvirnog modela koja kontroliraju ove elemente.

S plutajućim elementima, glavni zadatak je postići dobro okomito poravnanje na trenutna linija... U ovom slučaju uobičajena je praksa koristiti okomite margine ili padding:

Unos, odabir (širina: 120px; float: lijevo; margin-top: 0,4em;)

Ovaj pristup funkcionira kada ne trebate poravnavati blokove s tekstom, kao što je element oznake. U ovom slučaju možete koristiti relativno pozicioniranje, odsječak ili marginu na elementu koji sadrži samo tekst:

Drugi problem se javlja s gumbima. U ovom slučaju, kada imate gumb koji je veći od ostalih elemenata, možete ga postaviti vertikalno poravnanje korištenjem relativnog pozicioniranja:

Unos (float: lijevo; širina: 90px; položaj: relativan; vrh: 0,4em;)

Ovaj pristup relativnog pozicioniranja također funkcionira za potvrdne okvire i radio gumbe. Relativno pozicioniranje može se čak koristiti za normalizaciju lijevog dopuna legende u skupu polja.

Ako koristite elemente u kontekstu inline oblikovanja, tada možete koristiti svojstvo vertical-align za okomito poravnanje:

Oznaka, unos (okomito poravnanje: sredina; margina-desno: 1em;)

Lijepi rezultati može se postići kombiniranjem ovog svojstva sa svojstvom visine linije. Međutim, ovo svojstvo mora biti postavljeno na roditeljski element. Ako ga postavite izravno na sam element obrasca, koristit će se visina elementa:

Redak obrasca (visina reda: 1,4;)

Korištenje deklaracije visine roditeljskog elementa uparene s istom visinom retka također je dobra praksa:

Redak obrasca (visina reda: 1,8; visina: 1,8em;)

U kontekstu inline formatiranja, možete koristiti svojstvo poravnanja teksta da roditeljski element poravna sadržaj elementa obrasca ulijevo, u sredinu ili udesno.

Čudno ponašanje unosa datoteka

Element vrsta unosa datoteka je Posebna prigoda... Takav element bi iz sigurnosnih razloga uvijek trebao biti vidljiv i prepoznatljiv u sučelju preglednika. To znači da preglednici namjerno zanemaruju neka pravila stila (kao što su ona koja se odnose na vidljivost) i nastoje primijeniti vlastite algoritme kako je definirano njihovom zadanom tablicom stilova.

Također, neki preglednici prikazuju samo jedan gumb, dok drugi i dalje dodaju poluza put datoteke.

Međutim, web programeri pronašli su načine kako zaobići ovo ograničenje. Prvo omotaju spremnik oko elementa.