iPhone의 Safari에서 내 텍스트가 예상보다 크게 표시되는 이유는 무엇입니까?

iPhone의 Safari에서 글꼴 크기 불일치

명시적인 글꼴 크기를 설정했음에도 불구하고 iOS의 Safari에서 특정 텍스트를 더 크게 표시하는 경우가 발생할 수 있습니다. 예상보다 글꼴 크기 값이 더 작은 경우에도 마찬가지입니다. 이 예외 현상은 모바일 장치에서 가독성이 너무 낮은 것으로 간주되는 텍스트 크기를 자동으로 조정하는 Safari의 기본 동작으로 거슬러 올라갈 수 있습니다.

-webkit-text-size-adjust로 문제 해결

이 문제를 피하려면 CSS 속성 -webkit-text-size-adjust를 사용할 수 있습니다. -webkit-text-size-adjust를 설정하면: 100%; body 요소에서는 iPhone의 Safari에 지정된 글꼴 크기를 준수하도록 지시하여 자동 크기 조정을 무시합니다. 샘플 구현은 다음과 같습니다.

@media screen and (max-device-width: 480px) {
  body {
    -webkit-text-size-adjust: 100%;
  }
}

이 미디어 쿼리는 최대 너비가 480픽셀인 장치를 대상으로 하여 -webkit-text-size-adjust 속성이 iPhone 화면에만 적용되도록 합니다. 이 미디어 쿼리 내에서 Safari의 자동 크기 조정을 비활성화하면 글꼴 크기에 관계없이 모든 텍스트가 스타일시트에 지정된 대로 렌더링되도록 할 수 있습니다.

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