2009-11-21 5 views
4

이전에 다른 플랫폼의 동일한 브라우저에서 CSS와 거의 차이가 없었습니다. Mac의 Safari 페이지는 일반적으로 Windows의 Safari와 동일하게 보입니다 (FF-Mac과 FF-Mac도 동일). 그러나 이제는 두 Mac 브라우저가 PC에 비해 픽셀 단위로 일부 요소를 푸는 문제가 있습니다.OS에 특정한 CSS?

CSS를 적용하기 위해 특정 OS에서 브라우저를 선택하는 방법이 있습니까? 브라우저 대신 운영체제에서만 조건부 스타일 시트와 같은 것일 수 있습니까?

+0

다른 브라우저에서 동일한 브라우저에서 다르게 동작하는 브라우저는 무엇입니까? 내 생각 엔 버전이 다릅니 까? – mauris

+0

아니요, 이것은 꽤 가능합니다. 예를 들어, Mac의 FF2에는 FF2 Windows에없는 중요한 레이아웃 버그가있었습니다 (특정 상황에서 스크롤 막대가 누락 된 것과 같습니다). –

답변

4

CSS Browser Selector이 도움이됩니다. 특정 OS에 대한

+0

이것은 정확히 내가 뭘 찾고 있었는지 구현 한 것이고 어떤 이유로 Mac 브라우저에서 셀렉터를 추가하지 않았지만 클래스를 PC에 추가 한 것뿐입니다. 감사! – pixi

0

CSS 관련 트릭을 모르지만 Javascript로로드 할 스타일 시트를 선택할 수 있습니다. 더 많은 정보와 함께 OS 유형을 얻으려면 navigator.appVersion을 사용할 수 있습니다.

는 예를 들어, 내가 얻을 :

5.0 (Macintosh; U; Intel Mac OS X 10_6_2; en-us) AppleWebKit/532.5+ (KHTML, like Gecko) Version/4.0.4 Safari/531.21.10

(에서 : http://www.javascripter.com/faq/operatin.htm)

1

그것은 확실히 가능합니다. 가장 일반적인 접근법 (많은 JS 프레임 워크가 취하는)은 먼저 UA 문자열 및/또는 알려진 JS 객체/메소드의 존재에 기초한 플랫폼/브라우저 탐지를 수행하는 것입니다. (특히 가능하면 확실히 처음부터이 방법을 롤 아마

.gecko2.mac .specialRule { 
    // whatever 
} 

도전의 비트,하지만 그런 다음, 그들은 일반적으로 같은 규칙을 작성할 수 있도록 <head> 또는 <body>에 플랫폼/브라우저 CSS 클래스를 적용 당신은 특정 조합에만 관심이 있습니다).

1

변경 CSS는 :

나는 당신의 OS가 XP 또는 다른과 결과로 특정 CSS를두고있는 경우 인식이 기능을 썼다.

function changeStyle() { 
var css = document.createElement('link'); 
css.rel="stylesheet"; 
css.type = 'text/css'; 

if (navigator.appVersion.indexOf("Windows NT 5.1")!=-1){ /* IF is windowsXP */ 
css.href = 'styleXP.css'; 
} else { 
css.href = 'style7.css'; 
} 

document.getElementsByTagName("head")[0].appendChild(css); 
return false; 
} 
관련 문제