Astăzi am făcut o masă pentru un site, care a afișat rezultatul meciului online, cu actualizare automată. După finalizarea proiectului, am decis să îl testez pe un mic ecran și am fost foarte nemulțumit de rezultat.
În primul rând, tabelul nu se potrivește cu totul pe ecran, trebuie să derulați de fiecare dată pagina.
În al doilea rând, fonturile prea mari în diferite părți ale mesei.
Problema a trebuit rezolvată prin conectarea mai multor fișiere de stiluri pentru diferite rezoluții (* .css) pentru diferite rezoluții.
Cum se face acest lucru?
Și nu este greu să faci asta deloc. Pur și simplu definiți rezoluția ecranului prin Java Script și conectați fișierul de stil dorit.
Pentru a începe, în interiorul etichetei capului, la sfârșit, adăugați liniile
Acum puteți crea o copie a fișierului principal.css și îl puteți redenumi la main1024.css. Acum, în acest fișier de stil, puteți schimba toate elementele de dimensiune font la mai puțin, de exemplu, la 1 punct. De asemenea, este necesar să modificați dimensiunile imaginilor după lățimea și înălțimea parametrilor.
În acest fel vă puteți conecta pentru diferite rezoluții ale ecranului, diferite fișiere css.
Un exemplu de conectare a fișierelor de stil
Aici am discutat cum să prindem schimbarea în scară.
Fără scripturi? Și de ce? Putem face chiar și fără fotografii? Viteza punerii în aplicare a fost importantă, nu frumusețea codului. Stilurile au fost foarte diferite în proiectul meu. Pentru un site cu drepturi depline, este mai bine să utilizați aspectul adaptiv.
Articole similare
Trimiteți-le prietenilor: