[CSS] 모바일 폰트 크기 조절(text-size-adjust)

1. text-size-adjust 란?

• Viewport가 변경되면 폰트 사이즈가 변경됩니다.
  (아이폰의 경우 Viewport가 변경되면 자동으로 폰트를 조절)
• 반응형 웹사이트 제작시 폰트가 원치 않게(크거나 작음) 보이는 경우가 있습니다.
• 이를 방지하기 위한 방법으로 폰트를 고정 합니다. (text-size-adjust : none)
• 비표준 속성이므로 벤더 프리픽스를 사용 해야 합니다.

Value	Description
auto	화면 폭에 맞게 크기가 자동으로 조절됩니다.(device별로 크기가 다를수 있어서 비추천)
none(기본값)	화면 크기에 따라 자동조절 하지 않는다.
percentage (%)	퍼센트(%)로 크기를 조절합니다. (모든 device에서 동일한 텍스트 크기 부여 가능)
inherit	부모요소의 속성값을 상속받아 적용 됩니다.

 

 -webkit-text-size-adjust : none;  /* 크롬, 사파리, 오페라(신) */
 -ms-text-size-adjust : none;  /* IE */
 -moz-text-size-adjust : none;  /* 파이어폭스 */
 -o-text-size-adjust : none;  /* 오페라(구)*/

이 글이 도움이 되었다면 ♡(공감)를 눌러 주세요.