고객을위한 웹 사이트를 만들고 있는데 탐색 표시 줄의 이미지가 아닌 일반 텍스트를 사용하고 싶었습니다. 우리가 사용하는 글꼴은 Century Gothic입니다 (이 글꼴은 대부분의 PC 및 Mac에서 사용할 수 있다고 생각합니다). 문제는 다른 브라우저에서 글꼴이 크게 다르게 렌더링된다는 것입니다. Chrome에서는 원하는 방식으로 보였지만 파이어 폭스에서는 텍스트가 작고 대담합니다.
글꼴 속성을 변경하기 위해 브라우저 특정 Javascript를 작성하는 것 외에도 글꼴이 크로스 브라우저로 렌더링되는 방식을 표준화하는 다른 옵션이 있습니까? 아마도 일부 라이브러리 또는 API입니까? 글꼴 속성을 선언하는 데 더 구체적인 문제가 있습니까? 솔직히 나는 붙어 있고 도움이 필요합니다.
답변:
브라우저에서 동일하게 렌더링하기 위해 글꼴 및 기타 사항을 얻지 못합니다. 글꼴 처리는 완벽한 예입니다. Windows의 Safari는 어떤 이유로 텍스트를 굵게 표시하는 것을 좋아합니다. 불행히도 이것은 웹이 작동하는 방식입니다. 다양한 브라우저, OS, 모니터, 그래픽 프로세서 등은 사람이 웹 페이지를 볼 수있는 방법이 수천 또는 수만 가지라는 것을 의미합니다. 따라서 wbe를 만들 때 귀하의 사이트가 모든 사람에게 완벽한 픽셀이 아니라는 것을 알고 기대해야합니다. 인쇄되지 않습니다. 야생의 야생 웹입니다.
실제로 CSS에 글꼴을 포함시키는 방법이 있습니다. 매우 쉽습니다. 이를 수행하는 방법에 대한 자세한 내용은 http://randsco.com/index.php/2009/07/04/p680 을 참조하십시오 . 이것의 단점은 오래된 브라우저 (pre ei 7 및 ff 3 생각합니다 ...)는 이것을 지원하지 않는다는 것입니다. 그러나이 오래된 브라우저를 사용하는 사람들의 수는 빠르게 줄어들고 있으며 대부분의 PC에서 작동하는 대체 글꼴을 지정할 수 있습니다.
내가 사용하지 않은 또 다른 접근법은 플래시를 사용하는 것입니다. 내가 아는 것 이외의 다른 정보는 많지 않습니다.
다른 사람들이 이미 언급했듯이 우리는 완전한 통제권을 가지고 있지 않습니다. 그러나 브라우저가 전반적으로 비슷한 것을 렌더링하도록 돕는 데 도움이되는 몇 가지 사항을 언급 할 가치가 있다고 생각합니다. 둘 다 이미 "기본으로 돌아 가기"종류의 일이지만, 여러분이 쌓은 기초가 종종 성공 또는 실패로 이어 지므로 언급 할 가치가 있다고 생각했습니다.
CSS 리셋. 개념은 간단합니다. 스타일 시트에서 HTML 태그 기본값을 설정하여 HTML 렌더링의 공통 시작점을 설정합니다. 다음은 기사와 예입니다. http://meyerweb.com/eric/tools/css/reset/