[CSS]RWD - ekran telefonu Opcje

[marcus753]

Właśnie testuje różne rozwiązania RWD na swojej stronie i napotkałem mały problem...

Otóż mój telefon ma rozdzielczość FHD iphone ma rozdzielczość: 1136 x 640 Jak teraz mogę przygotować stronę żeby tu i tu wyświetlała się podobnie ?

Oczywiście mamy media queries tylko co z tego że zaznacze tam max-width 600px jak w telefonie mam rozdzielczość większa niż w monitorach ?

[by_ikar]

Od całkiem niedawna w chrome jest fajny emulator urządzeń mobilnych z uwzględnieniem pixel ratio. To że twój telefon potrafi wyświetlać rozdzielczość full hd, wcale nie oznacza, że obraz nie jest skalowany. A właśnie tak się dzieje, że ów obraz najczęściej jest skalowany. Więcej na temat tego emulatora poczytasz tutaj: https://developer.chrome.com/devtools/docs/device-mode

Nawet jeżeli chcesz wyświetlić na urządzeniu mobilnym które ma sporą rozdzielczość (via telewizory 4k na androidzie) to warto stworzyć osobne style, które poprzez kliknięcie, czy wcześniejsze sprawdzenie useragenta są dodawane do head.

A zupełnie najważniejszą rzeczą jest pisanie takiego kodu i projektowanie strony żeby nie było za dużo elementów których nie da się skalować procentowo (via layout zaprojektowany do jednej rozdzielczości).

PS. gdyby na 5 calowym ekranie wyświetlał się dokładnie obraz full hd, to 15 pixelowa czcionka wyglądałaby jak plamki. Stąd skalowanie.

Ten post edytował by_ikar 24.09.2014, 14:47:43