CSS 단위(단위)

단위는 CSS 속성에서 비이지 길이 값을 지정하는 데 사용됩니다. CSS에서 자주 사용되는 단위는 다음과 같습니다: px, em, pt, 백분율(%) 등.

CSS 단위 이해하기

길이를 측정하는 단위는 절대 단위(예: 픽셀, 포인트 등)와 상대 단위(예: 백분율(%) 및 em 단위)가 될 수 있습니다.

비이지值为 CSS 단위를 지정해야 합니다.因为没有默认单位。단위가 누락되거나 무시되면 오류로 간주됩니다. 하지만 값이 0이면 단위를 생략할 수 있습니다(결국, 0픽셀과 0인치는 같은 단위입니다).

상대적인 길이 단위

상대적인 길이 단위는 다른 길이 속성에 대한 길이를 지정합니다. 상대적인 단위는 다음과 같습니다：

em 및 ex 단위는 요소에 적용된字体 크기에 따라 달라집니다.

em 단위를 사용하여

measure1em은font-size사용하는 요소의 속성의 계산 값을 사용합니다. 이는 수직이나 수평 측정에 사용될 수 있습니다.

예를 들어, font-size는 요소의设置为16px에 설정하고line-height이设置为2.5em이면 line-height in 픽셀의 계산 값은2.5x16px =40px。

p {
　　　　font-size:　16px;
　　　　line-height:　2.5em;
}

font-size 속성의 값 자체에서 em을 지정하면 예외가 발생합니다. 이 경우, 부모 요소의字体 크기를 참조합니다.

따라서, 우리가 em을 사용하여 font 크기를 지정할 때,1em은 상속된 font-size. 따라서, font-size: 1.2em; 텍스트를 부모 요소의 텍스트보다 크게 만듭니다1.2倍。

body {
　　　　font-size:　62.5;
　　　　font-family: Arial, Helvetica, sans-serif;
}
p {
　　　　font-size:　1.6em;
}
p: first-letter {
　　　　font-size:　3em;
　　　　font-weight:　bold;
}

이 코드의 전체 의미를 이해해 보겠습니다. 모든 현대 브라우저에서 글꼴의 기본 크기는16px로 설정합니다. 우리의 첫 번째 단계는 텍스트를 font으로 설정하는 것입니다-size를62.5％를 줄이면 전체 문서의 크기를 줄이고, 이는 글꼴 크기를 다음과 같이 재설정합니다10px（16px의62.5％）。

이것은 기본적으로 라운딩된 값입니다font-sizepx와 em 간의 변환을 쉽게 할 수 있습니다.

防爆 장치를 사용하여

ex 단위는 현재 글꼴의 x 높이와 같습니다.

그 이유는 보통 소문자 'x'의 높이와 같아서 그렇습니다. 다음과 같이 보입니다. 그러나 ex는 'x'를 포함하지 않는 글꼴에도 정의됩니다.

절대적인 길이 단위

절대적인 길이 단위는 서로 고정됩니다. 그들은 출력 매체에 매우 의존적이므로, 알려진 출력 환경에서 특히 유용합니다. 절대 단위는 물리적인 단위(in, cm, mm, pt, pc)와 px 단위로 구성됩니다.

절대적인 물리적 단위(예를 들어 in, cm, mm 등)는 인쇄 매체와 유사한 고 해상도 장치에 사용되어야 합니다. 데스크톱과 저 해상도 장치 등의 스크린 디스플레이에 대해서는 픽셀 또는 em 단위를 사용하는 것이 좋습니다.

h1　{　margin:　0.5in;　}　　　　　　　/*　inches　　*/
h2　{　line-height:　3cm;　}　　　　/*　centimeters　*/
h3　{　word-spacing:　4mm;　}　　　/*　millimeters　*/
h4　{　font-size:　12pt;　}　　　　　/*　points　*/
h5　{　font-size:　1pc;　}　　　　　　/*　피카스　*/
h6　{　font-size:　12px;　}　　　　　/*　피카스　*/