Conversão Simples PX para EM

Selecione o tamanho da fonte do seu "Body"

Conversões 'base tamanho padrão do navegador' de 16px

Pixels EMs Percentual Pontos

Faça a conversão aqui

Calculadora personalizada de conversão

1. Digite um tamanho de pixel base

px

2. Converter

PX para EM
px
ou
EM para PX
em
Converter

3. Resultado

O que é um EM?

A Wikipedia explica bem: "Um 'EM' é uma unidade de medida no campo da tipografia, igual ao tamanho da fonte atual". Se o tamanho da fonte estiver em 16 pixels, 1em = 16px

Para mais informações, visite Wikipedia Wikipedia e Mozilla MDN.

Qual é a diferença de tamanho do texto entre PX, EM,%, PT?

Pixels e pontos são medições estáticas, mas comumente usadas em diferentes mídias. Os pixels são usados ​​nas telas porque as telas são medidas em pixels. Embora os pontos possam ser usados ​​na tela, eles são o padrão na impressão, pois são um fator de DPI.

Porcentagem e EMs, por outro lado, são medidas relativas. O tamanho de uma unidade EM ou porcentagem depende do pai. Se o texto do corpo for dimensionado em 12 pixels, o texto definido em 120% ou 1,2 EM no corpo será de 1,2 * 12 ou 14,4 pixels.

Como faço para converter entre PX, EM,% e PT?

Aqui estão as fórmulas usadas

Nota: 16 px é usado como o tamanho do texto do corpo em todas as conversões, porque esse é o padrão do navegador. Você alterará 16px para o tamanho do texto base.

PX para EM
Fórmula: tamanho em pixels / tamanho pai em pixels
Examplo: 12px / 16px = .75em
PX para %
Fórmula: tamanho em pixels / tamanho pai em pixels * 100
Examplo: 12px / 16px * 100 = 75%
PX para PT
Fórmula: tamanho em pixels * (pontos por polegada / pixels por polegada)
Examplo: 16px * (72pt / 96px) = 12pt
EM para PX
Fórmula: tamanho em EMs * tamanho pai em pixels
Examplo: .75em * 16px = 12px
EM to %
Fórmula: tamanho em EMs * 100
Examplo: .75em * 100 = 75%

Por que dimensionar seu texto com EMs em CSS?

'Style Sheets' - As Folhas de Estilo que usam EMs são mais fáceis de manter para o designer e mais acessíveis aos usuários finais.

'Style Sheets' - As Folhas de Estilo ficam mais fáceis de manter, porque todo o texto definido nos EMs é dimensionado para o tamanho da fonte do corpo. Somente o tamanho da fonte de um elemento precisa ser alterado, em vez de alterar individualmente o tamanho da fonte de cada elemento.

A acessibilidade é aumentada para os usuários finais, porque o texto é redimensionado com base em suas preferências, em vez de ser definido estaticamente em pixels. Além disso, os usuários finais podem usar teclas de atalho para dimensionar o texto em todos os navegadores. Muitas pessoas têm dificuldade em ler textos pequenos na tela do computador.

Os seus caminhos são caminhos de delícias, e todas as suas veredas são paz.

"Provérbios 3:17"