CSS에서 글꼴 크기를 픽셀 단위로 지정하려면 font-size 속성과 함께 px 단위를 사용하면 됩니다. 픽셀은 화면 해상도를 기준으로 하는 절대 단위이기 때문에, 원하는 크기를 정확하게 고정하고 싶을 때 유용합니다.
예제 코드
아래 예제는 h1 요소의 글꼴 크기를 30px로 설정하는 코드입니다.
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
font-size: 30px;
}
</style>
</head>
<body>
<h1>This is demo heading</h1>
<p>This is demo text.</p>
</body>
</html>실행 결과
위 코드를 실행하면 h1 제목 텍스트가 일반 문단 텍스트보다 확연히 큰 30px 크기로 화면에 표시됩니다.
참고 사항
픽셀(px) 단위는 브라우저나 기기와 상관없이 항상 동일한 크기를 보장하지만, 사용자가 브라우저에서 설정한 기본 글꼴 크기 환경설정에는 영향을 받지 않습니다. 따라서 접근성을 고려한다면 em이나 rem 같은 상대 단위를 함께 활용하는 것도 좋은 방법입니다.