@ font-face rendering in Windows 7

사용자 글꼴을 사용하려면 @font-face을 사용합니다. Firefox, IE, Safari 및 Mac의 Chrome에서 작동합니다. Chrome이 설치된 Windows 7에서 10px의 텍스트가 녹색이 아닌 검은 색 또는 회색으로 보입니다. ... 더 많은 테스트 후 : Firefox (Windows) 및 Safari (Windows)와 동일한 문제@ font-face rendering in Windows 7

어쩌면 Windows ClearType 렌더링과 관련이있을 수 있습니다. 그러나 Internet Explorer에서 작동하는 이유는 무엇입니까 ?? 페이지에

직접 링크 : http://www.light-work.de/chrome.html

키우면 정말 이상한! 이 문제는 10px fontsize (필요한 크기)에서만 발생합니다. light-work.de/webfontkit/ 아래에서 표본 개요를 볼 수 있습니다.

더 큰 스크린 샷 : http://light-work.de/styles/02.png

<!DOCTYPE HTML> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>google chrome</title> 
<style> 
/* Generated by Font Squirrel */ 
@font-face { 
    font-family: 'M10Regular'; 
    src: url('http://light-work.de/styles/m10/m10-webfont.eot'); 
    src: url('http://light-work.de/styles/m10/m10-webfont.eot?#iefix') format('embedded-opentype'), 
     url('http://light-work.de/styles/m10/m10-webfont.woff') format('woff'), 
     url('http://light-work.de/styles/m10/m10-webfont.ttf') format('truetype'), 
     url('http://light-work.de/styles/m10/m10-webfont.svg#M10Regular') format('svg'); 
    font-weight: normal; 
    font-style: normal; 

} 


body { 
    font-family: 'M10Regular'; 
    line-height: 20px; 
    font-size: 10px; 
    color:#666666; 
} 


</style> 
</head> 
<body> 
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. 
</body> 
</html>

출처

2011-05-06 opentype

크로스 브라우저 호환성을 원할 경우 언제나 Google 글꼴 http://www.google.com/webfonts – denislexic

을 사용할 수 있습니다. 이와 같은 상황에서 시도해야 할 첫 번째 일은 html : http : // validator의 유효성을 검사하는 것입니다. w3.org/ – AllisonC

귀하의 예를 들어 웹 페이지가 64 비트에 크롬 v11.0.696.60과 나를 위해 (실제로, # 666666) 회색으로 렌더링하는 것은 윈도우 7

하지 않는 텍스트를 마우스 오른쪽 버튼으로 클릭 컨텍스트 메뉴를 가져 오는 것이 좋습니다. 그런 다음 Inspect element을 클릭하십시오. 그러면 개발자 도구가 열립니다. 문제를 해결하는 데 도움을 줄 것입니다. 이것은 내가 당신이 볼 수 있듯이, 크롬은 사용자가 지정한 스타일에 따라 페이지를 렌더링하고

Screenshot of test page in Chrome, with developer tools open

볼 것입니다.

출처

2011-05-06 17:48:40

감사합니다. 훌륭한 도구입니다! 더 많은 테스트가 끝나면 Firefox 4.01 (WIN), Safari 5.05 (WIN) 및 Chrome 11.0.696.60 (WIN)에서 문제가 발생합니다. 좀 더 많은 컴퓨터에서이 페이지를 테스트 하겠지만 문제는 무엇인지 알 수 있습니까? 감사. – opentype

다른 컴퓨터에서 사이트를 테스트 한 결과 작동하고 있습니다. 귀하의 도움에 감사드립니다! – opentype

글쎄, 텍스트는 body 태그에 있지 않습니다. 그래서 귀하의 스타일을 적용해서는 안됩니다 (분명히 Chrome에는 없습니다). 질문은 다음과 같아야합니다 : 다른 모든 브라우저가 글꼴 설정을 고려하지 않는 이유는 무엇입니까? :-)

출처

2011-05-06 11:43:48

아, 미안, 무슨 실수 야! 불행히도 Google 크롬에서 여전히 잘못된 색상을 얻습니다. – opentype

브라우저가 잘못된 마크 업을 수용하려고하기 때문에. 각 브라우저는 유효하지 않은 마크 업을 유효 구조로 보간하려는 시도에서 다르게 해석합니다. –

답변

관련 문제