>웹 프론트엔드 >CSS 튜토리얼 >iPhone의 Safari에서 글꼴 크기가 예상보다 큰 이유는 무엇입니까?

iPhone의 Safari에서 글꼴 크기가 예상보다 큰 이유는 무엇입니까?

Susan Sarandon
Susan Sarandon원래의
2024-10-27 01:19:02952검색

Why Are Font Sizes Larger Than Expected in Safari on iPhone?

iPhone Safari의 글꼴 크기 조정 불일치

특정 시나리오에서 사용자는 iPhone의 Safari에서 렌더링된 글꼴 크기의 불일치를 경험했습니다. 더 낮은 값으로 지정된 경우에도 글꼴 크기가 예상보다 크게 나타납니다. 이 동작은 잠재적인 CSS 또는 기술적 제한에 대한 의문을 제기했습니다.

설명:

iPhone의 Safari는 작은 화면에서 가독성을 향상시키는 것을 목표로 하는 자동 텍스트 크기 조정 메커니즘을 사용합니다. 그러나 이 기능은 숫자 차이에도 불구하고 특정 글꼴 크기가 다른 글꼴 크기보다 크게 나타나는 경우 불일치를 초래할 수 있습니다. 이는 특히 최적의 가독성을 위해 지정된 글꼴 크기가 너무 작은 것으로 간주될 때 발생합니다.

해결 방법:

이 문제를 해결하려면 CSS 속성 -webkit을 사용하세요. -텍스트 크기 조정. 이 속성을 사용하면 Mobile Safari의 자동 텍스트 크기 조정을 재정의할 수 있습니다. iPhone의 크기 조정을 비활성화하려면 다음 CSS를 적용하십시오.

<code class="css">@media screen and (max-device-width: 480px){
  body{
    -webkit-text-size-adjust: 100%;
  }
}</code>

-webkit-text-size-adjust 속성을 100%로 설정하면 Safari에서 본문 요소 내의 텍스트 크기를 조정하지 않도록 지시하게 됩니다. 아이폰용. 이렇게 하면 13px 및 15px로 설정된 글꼴 크기를 포함하여 지정된 모든 글꼴 크기가 수정 없이 렌더링됩니다.

위 내용은 iPhone의 Safari에서 글꼴 크기가 예상보다 큰 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.