같은 브라우저에서 찍은 다른 페이지의 동일한 글꼴이 다르게 렌더링됩니다.

span 요소에 "font-family: PT Sans;"이 적용되었지만이 브라우저의 텍스트가 동일한 브라우저의 다른 페이지에서 다르게 렌더링됩니다. 홈 페이지에서는 "Arial" 글꼴 스타일을 렌더링하지만 로그인 페이지에서는 다른 것입니다. 나는 span에 "font-family: Arial;"을줌으로써 그것을 고쳐 내려고 시도했고, 모든 페이지에서 같은 것을 표현한다.같은 브라우저에서 찍은 다른 페이지의 동일한 글꼴이 다르게 렌더링됩니다.

첫 번째 font-family의 차이점과 올바른 수정 사항은 무엇입니까?

아무도 도와 줄 수 있습니까 ??

이

클래스 이름 "manageListing"로 스팬에 적용되는 스타일입니다 :

.manageListing { 
width: 133px; 
height: 21px; 
padding: 4px 0px 0px 0px; 
display: block; 
text-align: center; 
font-family: PT Sans; 
font-size: 14px; 
color: #ffffff; 
float: left; 
margin-top: 10px; 
-webkit-border-radius: 15px; 
-moz-border-radius: 15px; 
border-radius: 15px; 
-ms-border-radius: 15px; 
-webkit-box-shadow: 4px 4px 9px rgba(50, 50, 46, 0.28); 
-moz-box-shadow: 4px 4px 9px rgba(50, 50, 46, 0.28); 
box-shadow: 4px 4px 9px rgba(50, 50, 46, 0.28); 
-ms-box-shadow: 4px 4px 9px rgba(50, 50, 46, 0.28);  
}

출처

2014-07-11 Abhilash Madhavan

나에게 codey를 보여라 –

당신은 dev 도구를 조사 할 것이고, 당신의 스타일이 당신의 우선하게되는 스타일을 조사 할 수있다. 그건 그렇고 font-family : span Sans로 span 요소의 스타일을 지정하십시오. 첫 번째 단계로 특정 스팬에 클래스 이름을 지정하고 CSS Sans 부분을 CSS의 특정 클래스 이름에 적용합니다. – rpk

예. 스팸에 클래스 이름을 지정하고 스타일을 추가하고 시도했습니다. –

font-family: PT Sans은 fonts.googleapis.com에서 가져온 Google 글꼴이며이 문제는 (http)이 CSS 글꼴의 전체 URL에 추가되어 Google 글꼴을 가져 오는 것으로 인해 발생했습니다. 따라서 URL에 보안 프로토콜이있는 페이지는 font-family: PT Sans;이 아니며 URL이 안전하지 않은 페이지는 올바른 Google 글꼴을 사용하고있었습니다. 그래서 @import url(//fonts.googleapis.com/css?family=PT+Sans);에 CSS 파일에서 @import url(http://fonts.googleapis.com/css?family=PT+Sans);을 수정하고 문제를 해결했습니다. 내 문제를 해결해 주신 모든 분들께 감사드립니다.

출처

2014-07-14 03:33:36

그것은 다른 곳에서 글꼴을 상속해야합니다. "PT Sans"뒤에 "! important"를 붙이면 상속 된 값보다는 그 값을 취합니다.

출처

2014-07-11 09:10:25 user3821538

문제가 해결되지 않고 여전히 다르게 렌더링됩니다. –

'! important'를 던지면 단기적인 문제는 해결되지만 앞으로는 두통이 생길 것입니다. 대안이 없다면 사용하지 마십시오. 규칙이 이길 수 있도록 특이성을 높이는 것이 바람직합니다. – Ruskin

피드백에 대해 Ruskin에게 감사드립니다. –

같은 브라우저에서 찍은 다른 페이지의 동일한 글꼴이 다르게 렌더링됩니다.

답변

관련 문제