Px와 CSS에 EM 단위 사이의 차이

픽셀 픽셀 (화소) 상대 길이 단위 (CSS 자습서 2.0 수동)에서 디스플레이의 화면 해상도 상대적입니다.

EM 상대 길이 단위와 같은 행에서 현재 텍스트의 글꼴 크기는 브라우저의 기본 글꼴 크기 (css2.0 설명서에 인용 되는)을 기준으로 인위적으로, 설정 되지 않은 현재 개체 내에서 텍스트의 글꼴 크기에 상대적입니다.

모든 브라우저에 대 한 기본 글꼴 높이 16px입니다. 모든 조정된 브라우저는: 1EM = 16PX. 그래서 12px 10px 0.75em = 0.625em =. 글꼴 크기의 변환, 간단 하 게 하기 위해 그것은 EM 값 16px*62.5%=10px, 그래서 12px CSS에서 본문 선택에서 font-size=62.5%를 선언 하는 데 필요한 1.2em, 10px = = 1em, 즉, 단지 10, 원래 픽셀 값을 분할 하 고 EM 단위로 바꿉니다.

EM는 다음과 같은 특징이 있습니다.

1, 그들의 값이 고정 되지 않습니다;

2. em은 부모 요소의 글꼴 크기를 상속합니다.

그래서 우리는 CSS를 작성, 우리 두 지점에 주의를 지불할 필요:

1, 몸 선택기 선언 font-size=62.5%;
2, 당신의 원래 픽셀 값 10으로 나눈 다음 EM 단위;로 대체
3. 글꼴 크기의 반복 된 선언 하지 않으려면 확대 글꼴의 EM 값을 다시 계산.

그는 1.2 * 1.2 = 1.44의 현상을 방지 하는. 예를 들어 #content에 1.2em의 글꼴 크기를 선언할 수 있습니다만 1em이이 안에 다른 그들 때문에 P의 글꼴 크기, 아니라 1.2em를 선언 때 1em #content 글꼴 높이 상속 때문에 12px =.

PX, 사용 하고자 하는 대부분의 국내 디자이너 및 외국 사이트는 주로 EM을 사용 하 여 같은 그리고 둘 사이의 차이점은 무엇입니까 그들의 찬 부 양론 무엇입니까?

1, IE 수 없습니다 조정 장치 글꼴 크기;으로 픽셀을 사용 하는 사람들

2, 대부분 외국 웹사이트 조정 될 수 있다 그들을 사용 하는 글꼴 단위;

3, 파이어 폭스 px, em, 조정할 수 있지만 IE 브라우저 (또는 커널)을 사용 하는 중국 네티즌의 96% 이상.

픽셀 픽셀 (화소) 상대 길이 단위 (css2.0 매뉴얼에서 인용 되는) 디스플레이의 화면 해상도 상대적입니다.