Napravite dobar site danas jednostavno: postoji dovoljno stručnjaka, aktivni procesi poboljšanja funkcionalnosti i njegova prezentacija (struktura i sadržaj) se aktivno prate. Potonji je CSS dizajn - kao najjednostavnije, isplativo i učinkovito rješenje.

Borba između developera za kupca i vlasnika stranica za interes posjetitelja i prisustvo resursa preselila se u sferu finog oglašavanja i mekog (toplog i dinamičnog) sadržaja.

CSS prijelazi

Prema trenutnom mišljenju, CSS Transitions u pseudo-klasi: hover i back. Postoji stil oznake, na primjer TagStyle, a tu je i TagStyle: hover stil. Zadatak pseudo-klase je da sadržaj svih pravila drugog opisa stavi u prvi čim miš pređe preko njega, i čim to prođe, sve se vrati. U ovoj shemi (u klasičnoj verziji) obično se mijenja boja pozadine, boja teksta, okvir, zaokruživanje, udubljenja i drugi vidljivi elementi. Korištenje pravila CSS prijelaza omogućuje vam glatko i glatko.

Pravilo može promijeniti mnoge druge elemente, ali se obično koriste specificirani. Potpun popis pravila na koja utječe vlasništvo Transition CSS-a može se naći na službenim resursima na Internetu.

Sadržaj prijelaznog pravila

Zadatak pravila: glatko prenijeti druga pravila iz jednog stanja u drugo, tako da CSS Transition s uključuje (transition = '*'):

ime svojstva na koje utječe (*) objekt);

trajanje postupka (* - trajanje);

prijelazna funkcija (* -timing funkcija);

kašnjenje početka procesa (* -određen).

Unos kratkih pravila može se dopustiti pod CSS kanonima:

prijelaz: sve 1 s lakoćom .5 s;

Prijelaz se odnosi na sva pravila, koja se izvršavaju u sekundi u stilu "lakoće" s odgodom od pola sekunde. Sve isto, napisano elementima pravila:

* - svojstvo: sve;

* - trajanje: 1 s;

* -timing funkcija: lakoća;

* - odgoda: .5s;

Pravilo o tranziciji podržavaju glavni preglednici, ali to nikada ne utječe na to i postoji unakrsni pregled pisanih pravila.

Klasična primjena

Najlakši i najčešće korišteni prijelaz je boja pozadine (simbola): CSS Transition: pozadina: U ovom primjeru, samo pravilo pozadinske boje primijenit će pravilo prijelaza (trajanje 2 sekunde, izostavljanje funkcije, kašnjenje 0,2 sekunde), a druga pravila će se odmah premjestiti u drugo stanje.

Prijelazna funkcija (stil)

Važna komponenta pravila CSS-a je prijelazna funkcija, tj. Vremenska krivulja za provođenje prijelaza iz jednog stanja u drugo. Glatko (lako) je zadana vrijednost: prijelaz počinje polako, ubrzava se i usporava na kraju. Vrijednost 'linearno' definira jedinstveni prijelaz: 'olakšavanje' - polako počinje prijelaz, zatim glatko ubrzava do kraja, a 'olakšava' - radi obrnuto. Funkcija kubni-bezier (x1 y1 x2 y2) omogućuje vam da napravite vlastitu mogućnost prijelaza, ali korištenje službenih resursa i web-mjesta koja imaju dobro iskustvo s Bezijevom krivuljom još su bolji. Nešto novo definitivno neće izaći, ali iskustvo ugodnog oka i mogućnosti psihologije posjetiteljaakumulirani je i dalje znatan.

Kombinacija prijelaza s transformacijom

Dobar učinak daje kombinacija pravila CSS Transition & amp; Transform. Prvo određuje vrijeme procesa, drugo pokazuje da treba raditi sve ovo vrijeme. Pretvori omogućuje pomicanje oznaka, rotiranje, promjenu veličine, promjenu položaja. Razmotrimo kombinaciju:

transformirati: rotirati (180 stupnjeva);

prijelaz: sve 2 sekunde .2 s;

Za dvije sekunde, pretvorit će sadržaj oznake za 180 stupnjeva. Eksperimentirajući s funkcijama translate, scale, rotate, skew i njihovim varijacijama, možete postići zanimljive efekte i dati vašem radu jedinstvenu originalnost. CSS3 također omogućuje izvođenje 3D transformacije, to jest, pomicanje oznake u xyz koordinatama, što u kombinaciji s CSS Transitions omogućuje rotiranje teksta i figura po potrebi za postizanje cilja.

Kompatibilnost s tranzicijskim pravilom

Ako je korištenje CSS prijelaza za pozadinu, granicu, boju i druga očigledno vizualna pravila normalno, prirodno i prikladno, onda u nekim slučajevima, na primjer, pokušava kombinirati CSS prijelaz & Prikaz, možete jednostavno provesti vrijeme i ne postići željeni. Općenito govoreći, prilikom planiranja korištenja vizualnih efekata preporuča se dodijeliti "vidljivo iz svestranog". Napravite dobru rotaciju oblika teksta ili za određeno vrijeme - akciju koja je mala u odnosu na ono što daje prikaz svojstva, vidljivost, z-indeks. Međutim, ako su posljednje dvije jasno navedene u popisu pravila na koje se odnosi CSS Transition, tada se prvi ne spominje, iako njegovo korištenje donosi nešto u oznaku koja je primjetna, ali loše vođena.


Prijelazno pravilo nije samo: lebdi i natrag, može se uspješno primijeniti na druge pseudo-klase, na primjer: fokus ili: aktivno. Općenito, Transition i Transform su one CSS značajke koje nemaju izravan odnos s logikom stvari (svejedno je riječ o stilovima, a ne o algoritmima). No, tijekom proteklih nekoliko godina naglasak je pomaknut tako da se ne koristi bogati arsenal CSS-a i CSS3-a jednostavno neprihvatljiv luksuz.

O abnormalnom i prirodnom

Na početku osobnih računala, kada je matematički procesor izdan za matematičke izračune, bilo je neuobičajeno imati 386. računalo bez matematičkog ko-procesora kada je riječ o učinkovitoj upotrebi Fortran programa za izračunavanje staze na Mjesec Danas, dakako, nitko ne dolazi na čelo, kupujući računalo, pitajući ga ima li hardverski izveden način za matematičke izračune.