Ce este aspectul adaptiv

Deci, ceea ce se înțelege printr-un cuvânt „receptiv“? aspect receptivă - acest aspect, care ajustează în mod automat pentru a (adapta), în conformitate cu rezoluția dispozitivului, care este în prezent vizualizați pagina utilizatorului. De exemplu, dacă te uiți la pagina de pe marele ecran sau televizor, atunci va avea un singur site de cartografiere, iar dacă vizualizați aceeași pagină de la, de exemplu, un dispozitiv mobil, atunci va avea o viziune complet diferită a acestei pagini.

În plus față de cele de mai sus, clienții sunt din ce în ce cer să faceți este aspectul adaptiv. prin urmare, să-l cunoască și să fie în măsură să impună această metodă este necesară pentru orice dezvoltator web modern.

În primul rând avem nevoie pentru a afla ce este inclusă în conceptul de „aspect de adaptare“? Și în acest concept includ:

• fonturi flexibile
• aspect flexibil, bazat pe o grilă
• imagine flexibilă
• interogări media

fonturi flexibile - fonturi care nu sunt definite în mod rigid în px (pixeli), și le. valoarea care poate varia.

Să ne uităm la un exemplu simplu

corp font-size: 16px;
>

Ceea ce sunt indicate aici? Nu doar pentru a scrie tag-ul dimensiunea corpului 16px. pentru că acest lucru este dimensiunea fontului care este acceptat în mod implicit în browser. Acum, avem nevoie, pe baza acestei valori, specificați dimensiunea fontului la 24px pentru antet H1. Cum de a face acest lucru? Este foarte simplu! Pentru aceasta este formula

țintă / context = rezultat

Amintiți-vă această formulă, este încă util pentru noi.

Avem nevoie pentru a obține 24px dimensiunea fontului. dreapta? - acesta va fi obiectivul nostru.

Am stabilit fontul implicit - 16px - acest context.

Noi credem: 24/16 = 1,5

Ie dimensiunea H1 este 1.5em.

Deci, cu asta.

Să mergem mai departe și să vorbim despre o grilă flexibilă.

Imagine flexibilă - o foarte importantă și nu este de fapt un subiect dificil.

Imagine flexibilă - o imagine care nu sunt statice în nici un bloc, și de a schimba dimensiunea lor, în funcție de rezoluția ecranului utilizatorului, și lățimea coloanei. Este foarte ușor de implementat, dar există multe capcane asociate cu browser-ul Internet Explorer. dar vom vorbi despre ei.

Iar ultimul - interogări media.

Media interogări - acestea sunt condițiile care sunt fie executate sau nu executate.

Acestea și mai complexe condiții sunt realizate folosind interogări media, și este, de asemenea, un subiect foarte interesant, care va fi dezvăluire foarte detaliate în articolul corespunzător.

Deci, astăzi am discutat despre ce aspect adaptiv. ceea ce este inclus în acest concept, și chiar au învățat cum să facă fonturi flexibile.

Vă mulțumesc pentru atenție și nu pierdeți următorul articol!