pt, px, em, % 비교표
2005.04.17 ,
오후 05:02
CSS,웹 디자인,추천/리뷰
16 comments »
웹디자인을 하면서 글꼴(폰트) 크기를 표현하는 방법에는 pt, px, em, % 가 있다. 나는 이미지 사용이나 기존 테이블 레이아웃을 할 때의 습관으로 px 를 주로 사용하는 편이다. 하지만 해외 웹사이트의 대부분이 em 을 사용하며, 유동성 부분 때문에 em이 표준으로 자리잡아가고 있다.
REEDdesign 사이트에 이들 수치에 대한 비교표가 있다.
![]()
- TAG : table, 폰트
- RSS : 매번 사이트에 방문하지 않아도 RSS로 편리하게 글을 구독할 수 있습니다.
- CCL : 이 저작물은 크리에이티브 커먼즈 라이센스에 의하여 이용할 수 있습니다.


16개의 의견이 있습니다. | 당신의 의견을 바랍니다.
1.
erin |
2005.04.17 ,
오후 05:15 ·
permallink
아무래도 em이나 pt가 좋죠.. px보다는…
저 같은 경우는 pt를 선호하는 편입니다..
2.
hooney |
2005.04.17 ,
오후 05:30 ·
permallink
해외에서는 em이 표준으로 자리잡아간다고 하더군요. pt는 모니터 해상도에 영향을 많이 받고, px는 mac과 linux에서 예상치 못한 결과를 초래한다고 하네요. ^-^
3.
erin |
2005.04.17 ,
오후 07:04 ·
permallink
네.. 한참 px 쓰다가 당황스러운 적이 있어서요… pt로 곧 바꿨던 것으로 기억함니다.. 금방 이야기 듣고는 em으로 변경했습니다. 모니터 해상도에 영향을 받는다라… 곰곰히 생각을 해 봐야겠습니다.
4.
likejazz |
2005.04.18 ,
오전 02:36 ·
permallink
굿! 방금 제 블로그의 모든 폰트를 em 단위로 변경하였습니다.
5.
hooney |
2005.04.18 ,
오전 09:17 ·
permallink
저 역시 likejazz님 블로그에서 좋은 정보 많이 얻었답니다.
6.
쿠키~* |
2005.04.18 ,
오후 12:09 ·
permallink
윽.. 전 예전에 한참 pt로 쓰다가
언젠가 (아마도 F모에이전시) 다른 코더들이 px을 추천해주길래 px로 다 바꾸어서 썼는데..
이제 다시 또 em으로 바꾸어야 겠네요@_@
회사에서 포인트 비교하려구..
저것과 비슷한 표를 로컬에 만들어 두었는데
전 미리보기식으로 만들었어요.. 그래서 표가..
밑으로 갈수록 대빵 만해졌답니당… 으흐흐
7.
hooney |
2005.04.18 ,
오후 02:40 ·
permallink
저도 사실 어제서야 em으로 수정했답니다.
기본폰트 크기를 12px로 쓰다가 0.75em으로 변경하니 어색하더군요.
해외 사이트들은 폰트 뿐만 아니라 div 박스나 span에서 활용하고 있더군요.
8.
tux |
2005.04.20 ,
오후 10:45 ·
permallink
em이 표준으로 잡아간다는것에대한 문서 혹시 링크 가능할까요? 그런것에 대해 논하는 곳을 알고싶어요~ 우리나라에선 거의 전무하다 시피한 부분이라서요.
좋은정보 감사합니다!
9.
hooney |
2005.04.21 ,
오전 12:12 ·
permallink
WCG(Web Standards Group)에 가시면 관련 내용을 찾을 수 있습니다.
WCG는 로그인을 해야 포럼 내용을 확인할 수 있기 때문에 링크가 안돼네요.
간단한 절차에 따라 가입하시고 WCG의 회원이 되세요~ 어쩌면 당신 한국의 3번째 회원인 될 수도 있답니다.
10.
일모리 |
2005.04.21 ,
오전 12:29 ·
permallink
저도 가입은 했지만… ㅡㅜ
Korea 로는 하지 않았네요 확 Korea 로 할까요? ㅎ
11.
hooney |
2005.04.21 ,
오전 12:46 ·
permallink
일몰님 / 제가 일몰님 블로그 버튼 만들어 논 거 있는데, 멜로 한번 보내드릴까요?
WP 일몰 블로그의 파비콘을 사용했답니다. ^^;
12.
일모리 |
2005.04.21 ,
오전 09:29 ·
permallink
네 당연히 감사히 받아야죠 ^^
13.
likejazz |
2005.04.28 ,
오후 05:08 ·
permallink
em 의 결정적인 문제점을 발견했어요. IE 5.5 이하에서 1em 의 크기가 지나치게 큽니다. 1em 의 크기가 지금의 크기가 된건 IE 6.0 에서부터인듯해요.
14.
erin |
2005.04.29 ,
오전 07:01 ·
permallink
아무래도 pt를 계속 사용해야 겠습니다.
15.
hooney |
2005.04.29 ,
오전 08:42 ·
permallink
요즘 스팸글이 많기 때문에, 1주 전에 작성한 글에 답글을 달면 일단 조정상태로 대기시키는 플러그인을 설치했답니다. ^^;
바로 IE5.5를 설치하고 테스트해봐야 겠습니다. 좋은 정보 가르쳐주신 likejazz님 감사합니다.
16.
gildong's Web doodles |
2007.06.29 ,
오전 11:04 ·
permallink
div 크기 단위 px 와 em 의 차이점…
웹표준을 준수하기 위해 CSS 를 공부 중이다.이전까지는 아주 단순히 화면에 나타나는 위주로만 구성하다가 이제 웹표준에 맞춰 정식으로 적용해보려 한다.그중 가장 사용빈도가 많은 태그인…
당신의 의견을 바랍니다..
사용할 수 있는 HTML 태그 :
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>