Sfat rapid Un curs de coliziune în interogările media CSS

În trecut, pentru a crea machete bazate pe lățimea browserului utilizatorului, a trebuit să folosim JavaScript - probabil combinat cu un limbaj de server. Din fericire, procesul devine acum mult mai simplu, datorită interogărilor media CSS.

Abonați-vă la pagina noastră YouTube pentru a viziona toate tutorialele video!
Prefer să vizionați acest videoclip pe scenariu?

Metoda 1: În foaia de stil

 Ecran @media și (min-width: 1200px) / * hai să facem ceva '* /

Metoda 2: Importați din interiorul foii de stil

 ecranul @import url (small.css) și (min-width: 1200px);

Rețineți că puteți adăuga, de asemenea, reguli de adăugare, prin aplicarea unei virgule - la fel ca atunci când utilizați selectori multiple.

Metoda 3: Legătura cu o foaie de stil

Metoda 4: Direcționarea iPhone-ului

O notă interesantă, după un pic de cercetare în jurul web-ului, este că, în ciuda faptului că iPhone 4 are o rezoluție de 640x960, încă ne ridicăm mobile.css, menționată în codul de mai sus. Cât de ciudat? Dacă aveți mai multe informații despre acest lucru, vă rugăm să lăsați un comentariu pentru restul dintre noi!

Browsere care acceptă interogări CSS Media

Firefox 3.5+
Opera 9.5+
Safari 3+
Crom
Internet Explorer 9+

Rețineți că Internet Explorer 8 și versiunile anterioare nu acceptă interogări media CSS. În aceste cazuri, ar trebui să utilizați o rezervă JavaScript.

Cod