Chrome 모달 상자에서 내 글꼴이 흐릿한 이유는 무엇입니까?

모달 상자의 Chrome 글꼴 흐릿함: 문제 해결 및 해결

Chrome 모달 상자의 흐릿한 글꼴 문제는 실망스러울 수 있습니다. 문제가 Chrome에서는 나타나지만 IE 및 Firefox와 같은 다른 브라우저에서는 나타나지 않을 수 있지만 근본 원인은 브라우저 자체가 아닌 CSS에 있는 경우가 많습니다.

제공된 CSS를 조사한 결과 원인이 CSS에 있는 것으로 나타났습니다. 모달 상자 클래스:

.md-modal {
    ...
    -webkit-transform: translateX(-50%) translateY(-50%);
    ...
}

모달 상자를 수평 및 수직 중앙에 배치하는 이 변환은

이 문제를 해결하려면 0.5px를 빼서 Y축 변환 값을 조정해야 합니다.

.md-modal {
    ...
    -webkit-transform: translateX(-50%) translateY(calc(-50% - .5px));
    ...
}

이 수정을 통해 모달 상자가 약간 위쪽으로 효과적으로 이동하여 흐릿한 글꼴을 제거합니다. 텍스트 문제입니다.

참고: CSS 클래스 이름이 ".md-modal"은 응용 프로그램에 따라 다를 수 있습니다. 사용자는 변환을 정의하는 해당 CSS 클래스를 식별하고 제안된 조정을 적용해야 합니다.

위 내용은 Chrome 모달 상자에서 내 글꼴이 흐릿한 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!