Html의 글꼴 크기 단위 px, em, pt에 대한 구체적인 분석

웹 페이지의 글꼴 크기를 정의하는 세 가지 일반적인 단위는 px, em, pt입니다.

px

px는 픽셀의 약자로 웹 탐색 과정에서 텍스트, 텍스트, 화면의 사진 등은 화면에 따라 변경됩니다. 너비가 100px인 사진은 800×600 해상도에서 화면 너비의 1/8을 차지하지만 약 1/8만 차지합니다. 1024×768 해상도로 10개. 따라서 글꼴 크기를 정의할 때 단위를 px로 사용하는 경우, 사용자가 표시 해상도를 800에서 1024로 변경하면 사용자가 실제로 보는 텍스트는 "더 작아지게"(자연 길이 단위), 심지어 불분명할 수도 있습니다. , 찾아보기에 영향을 미칩니다.

em

em: 즉, %는 상대 단위이자 길이의 상대 단위입니다. 원래는 문자 M의 너비를 나타내므로 이름이 em입니다. 이제 이는 문자 너비의 배수를 나타내며 사용법은 0.8em, 1.2em, 2em 등과 같은 백분율과 유사합니다. 일반적으로 1em=16px입니다. , 일반적으로 길이(예: 요소의 여백 및 패딩)를 측정하는 데 사용되는 범용 단위입니다. 글꼴 크기를 지정하는 데 사용되는 경우 em 단위는 상위 요소의 글꼴 크기를 나타냅니다.

페이지에 있는 상위 요소의 글꼴 크기에 따라 하나의 요소를 조정하여 모든 요소의 크기를 비례적으로 변경할 수 있습니다. 확장 가능한 스타일 시트를 만드는 데 사용되는 것처럼 크기를 자유롭게 조정할 수 있습니다.

pt

PT는 포인트(pound)의 약어로, 1/72인치 크기의 고정된 길이 측정 단위입니다. 웹에서 텍스트 단위로 pt를 사용하면 화면마다 글꼴 크기가 동일(동일 해상도)되어 조판에 영향을 미칠 수 있지만, 워드에서는 pt를 사용하는 것이 매우 편리합니다. Word를 사용하는 주요 목적은 화면 탐색이 아니라 출력 및 인쇄이기 때문입니다. 엔터티로 인쇄할 때 pt는 자연 길이 단위로 편리하고 실용적입니다. 예를 들어 Word의 일반 문서에서는 "노래 글꼴 9pt"를 사용하고 제목은 "Helvetica 16pt"를 사용합니다. 인쇄할 때는 항상 이 정도 크기여야 합니다.

Conversion

브라우저의 기본 글꼴 높이는 16px이므로 조정되지 않은 브라우저는 1em=16px, 즉 1px=0.0625em을 표시합니다. 글꼴 크기 변환을 단순화하기 위해 CSS 본문에서 전역적으로 글꼴 크기=62.5%를 선언할 수 있습니다. 즉, 기본 글꼴 크기는 16px*0.625=10px로 정의됩니다. 하위 요소는 글꼴 크기를 상속합니다. 따라서 1em=10px이므로 12px=1.2em입니다. px와 em 사이의 변환은 10을 통해 얻을 수 있습니다. 하지만 Font-size=0.625em을 정의하거나 12px를 직접 정의하는 것은 효과가 없습니다.


또한 IE가 한자를 처리할 때 부동 소수점 값의 정확도가 ​​제한된다는 점에 유의해야 합니다. 위 방법(1.2em) IE의 한자는 12px로 직접 정의된 글꼴 ​​크기와 동일하지 않지만 약간 더 큽니다. 62.5%를 63%로 바꾸시면 됩니다.

pt와 px 사이의 변환 공식도 비교적 간단합니다. pt=px 곱하기 3/4입니다.

위 내용은 Html의 글꼴 크기 단위 px, em, pt에 대한 구체적인 분석의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!