Características Apple iPhone 5

Capture de l'iPhone 5 PNG

Resolução do viewport (regras CSS)

É a resolução que mais interessa aos designers e desenvolvedores, pois condiciona os breakpoints e a definição das media queries. Em geral, só se fala dessa resolução.
Em relação a Apple iPhone 5, ela é de:

  • 320 pixels em largura (width)
  • 568 pixels em altura (height) ⚠️ a altura é indicativa, pois o navegador Safari, Chrome, etc.. reduz a área visível

ℹ️ Algumas ferramentas de análise mostram apenas a resolução do fabricante (abaixo) e não a apresentada acima, portanto, cuidado ao interpretar os resultados.


Disponível no simulador

Teste seu site responsivo em Apple iPhone 5 graças à extensão do navegador.
É gratuito e ativável em 2 cliques.

Instalar a extensão

Densidade de pixel

No Apple iPhone 5 ela é de 2

Se você deseja segmentar em CSS os dispositivos com pelo menos essa densidade de pixel, você pode usar esta media query.

                        
                            @media only screen and (-webkit-min-device-pixel-ratio: 2) {
    /* CSS */
}

Também em javascript, é possível recuperar o valor da densidade de pixel.

                        
                            window.devicePixelRatio
// O que retornará o número 2

Resolução do fabricante Apple iPhone 5

Dada a densidade de pixel, isso resulta em:

  • 640 pixels em largura
  • 1136 pixels em altura

Mockup HD gratuito no formato PNG

Mockup gratuito de Apple iPhone 5 em HD no formato PNG e PSD com fundo transparente
Mockup Apple iPhone 5 em HD PNG transparente Resolução 756 ✕ 1600px (47.19 ko)