sonny의 작은집

브라우저에는 '텍스트 크기'라는 옵션이 공통으로 있다.
이걸 바꾸면 현재의 페이지에 있는 글자크기가 거의 다 바뀐다.
그런데 내 블로그는 그 설정과는 상관없이 원래크기 그대로 보여주고 싶다.

그전에 '글자색 변경'을 했던 경험으로 다시 한 번 바꿔보자.

style.css 내용중
----------------------------------------------------------------------
/* 본문 공통 */
body{
  font:0.75em/1.5 Dotum, Verdana, AppleGothic, Sans-serif;
  background-color:#ddd;
  color:#666;
}
a:link          { color:#333;     text-decoration:none;}
a:visited       { color:#333;     text-decoration:none;}
a:hover         { color:#7870ab;  text-decoration:underline;}
a:active        { color:#666;     text-decoration:none;}
----------------------------------------------------------------------

여기서 이해가 안갔던 건 0.75em/1.5이다.
이게 포인트도 아니고 캐릭터도 아니기 때문에 이게 뭔지부터 알아봤다.

css2 스펙을 보니, font tag는 font-style/font-variant/font-weight/font-size/line-height/font-family'를
한꺼번에 정의하기 위해 쓰여지는 태그다.
'em'은 현재 구성요소에 비례한 폰트 크기를 말하는 단위이다.
/뒤의 1.5는 line-height이므로 건드리지 않고,
앞의 0.75em을 절대단위인 pt로 하기로 하고 크기는 12로 지정했다.
성공이다. 브라우저의 '텍스트 크기'에 따라 춤추던 블로그의 글자 크기가 변하지 않고 고정된다.
9.8pt가 스킨이 깨지지 않는 최대의 크기였다.

P.S. 급수정 : 크롬에서 스킨 배치가 깨져 9.7pt로 급수정!!