Sa intamplat sa scriu articole, verificand verbal un design nou. Cred că aceasta este cea mai bună opțiune, deoarece există posibilitatea de a înțelege imediat codul care este prezent acolo, decât de a căuta totul dintr-un dosar destul de mare.
Și astăzi scopul nostru este să creștem imaginile când plasăm mouse-ul, fără a folosi j # 1072; vascript. Totul se va face prin CSS3.
Să ne mișcăm puțin din descrierea articolului, deoarece acest exemplu poate fi aplicat nu numai imaginilor, ci și diferitelor tipuri de blocuri. O creștere treptată vă va permite să vă concentrați atenția asupra blocului dvs. De exemplu, acest lucru poate fi văzut în exemplul articolelor din acest bloc, deși există mai multe efecte simultan. Cu toate acestea, ele se concentrează pe informații, atrăgând utilizatorul.
Deci, să creăm un bloc.
Proprietatea de depășire controlează afișarea conținutului unui element bloc dacă depășește domeniul de dimensiuni specificat. În cazul nostru, ascunse spune că overflow este ascuns. Dacă nu punem o suprapunere, atunci când plasați cursorul imaginii va depăși domeniul de aplicare specificat. Acest lucru poate fi util la diferite ocazii, dar nu la noi. Deși nu este rău să te uiți în galerie.
Lățimea și înălțimea sunt lățimea și înălțimea Setați în funcție de nevoile dvs. Acestea sunt dimensiunile în care imaginea va fi mărită.
Să setăm stilurile pentru animația noastră.
Proprietatea de tranziție specifică timpul, precum și direcția transformării. tranziția spune că transformarea are loc cu toate părțile. Poate fi deasupra (partea de sus), partea de jos (partea de jos), etc. 1s indică timpul de transformare. În cazul nostru, acesta este 1 sec. Dacă doriți să accelerați animația, reduceți timpul. relaxarea în proprietatea de tranziție înseamnă că animația începe rapid și încetinește spre sfârșit.
Proprietatea transformă vă permite să transformați un element. Cu această proprietate, puteți scala, roti, schimba, înclina. Funcția de scalare măsoară elementul orizontal și vertical. 1 - 100%. Mai puțin de unul pentru a reduce. Mai mult de o creștere.
Aceasta este întreaga lecție, cum se face o creștere ușoară a imaginii. După cum puteți vedea, totul este clar și simplu.
Dragi cititori! Dacă găsiți o eroare în text, nu fi leneș, selectați cuvântul și apăsați CTRL + Enter. Să facem limba mai curată!
Știri asemănătoare cu: Îmbunătățirea imaginii netede pe CSS3 pură
Moduri de conectare a faeriilor # 774; la stil # 774; CSS
Astăzi vom vorbi despre CSS3, sau, mai degrabă, aspectul adaptiv. Am vorbit despre aspectul adaptiv propriu-zis într-un articol anterior. În acest articol, vom examina ce instrumente CSS3 pot utiliza pentru a produce o astfel de marcare. De fapt, există mai multe opțiuni pentru stabilirea unor astfel de reguli, și fiecare
Modalități de atașare a unui fișier stil CSS
Astăzi vom vorbi despre CSS3, sau, mai degrabă, aspectul adaptiv. Am vorbit despre aspectul adaptiv propriu-zis într-un articol anterior. În acest articol, vom examina ce instrumente CSS3 pot utiliza pentru a produce o astfel de marcare.
Imagini de depozit - Faceți bani pe imagini
Mulți bloggeri, saytostroiteli și utilizatori doar pun online un număr imens de imagini și fotografii. Și acum există un serviciu care vă permite nu numai să vă păstrați imaginile nu pe găzduirea dvs. (unde, de regulă, nu o cantitate atât de mare de spațiu liber), ci și pe
Kasseler CMS
Kasseler este un alt sistem minunat pentru construirea unui site web. În cea mai recentă versiune a lui Kasseler, s-au făcut modificări globale, deoarece are o structură comună de module cu versiuni de clasă Full. De asemenea, nucleul clasei Lite și Full a devenit identic.
Articole similare
Trimiteți-le prietenilor: