특정 브라우저에 대해 다른 CSS 스타일 사용

StackOverflow https://stackoverflow.com/questions/1637534

  •  07-07-2019
  •  | 
  •  

문제

IE와 다른 브라우저에 대해 별도의 CSS를 갖는 가장 좋은 방법은 무엇입니까?저는 IE, Firefox, Safari 사용자만을 타겟으로 삼을 생각입니다.특히 이제는 IE를 제외한 대부분의 브라우저에서 CSS3를 지원합니다.

내가 본 다양한 방법은 다음과 같습니다.

  1. 별도의 스타일시트 로드 조건부로 사용 <!--[if IE]>
  2. 밑줄 해킹 및 기타 다양한 인라인 IE 해킹

(1)은 특히 개발할 때 추가 작업이므로 (2)를 선호합니다.그러나 (2)는 항상 작동하지 않는 것 같습니다.가장 효율적인 방법은 무엇입니까?

도움이 되었습니까?

해결책

나는 당신의 문서 상단에 모든 것이 픽업되는 하나의 스타일 시트를 가질 것입니다.

이 아래에서 당신의 [!-[if]] 조건부 스타일 시트를 수행하십시오.

여기에서 IE에서 문제를 일으키는 스타일을 무시하십시오. - 선택한 특정 클래스의 마지막 스타일은 따라야 할 스타일입니다.

다른 팁

우리 팀은 세 가지 규칙에 따라 CSS를 처리합니다.

  1. 일반/공통 CSS 파일이 가능한 한 모든 브라우저에서 가능한 한 가깝게 작동하는지 확인하십시오.
  2. 모든 IE "버그"를 별도의 파일로 처리하고 IE 조건으로 스타일 시트를로드하는 제어.
  3. 첫 두 규칙에 따라 작동하지 않는 한 해킹이 허용되지 않습니다.

모든 핵심 CSS를 단일 파일에 보관하는 데 동의합니다.ASP.NET을 사용하는 경우 WebHandler를 사용하여 실제로 전송되는 CSS를 관리할 수 있습니다.다른 언어에도 비슷한 해결책이 있을 것이라고 확신합니다.이를 통해 필요한 것만 보내고 캐시할 수 있습니다.또 다른 이점은 여러 CSS 파일을 결합하여(이렇게 하는 경우) 하나만 제공할 수 있다는 것입니다.웹 서버에 대한 요청 수를 줄이는 것은 좋은 습관입니다.

그런 다음 [if lt IE 8] margin:과 같이 작성할 수 있습니다.0px;IE8이나 FF 등으로 전송되지 않습니다.

HTML만 사용하는 경우 위에서 언급한 [!--[IF IE]] 스타일 조건을 따라야 합니다.

우리는 매우 큰 프로젝트에서 WebHandler를 사용하고 있으며 다른 방법으로는 사용하지 않을 것입니다.

보다 http://www.conditional-css.com/download.PHP, C#, C에서 사용할 수 있습니다.

행운을 빌어요.

<!--[if !IE]><!--><link rel="stylesheet" href="non-ie.css"><!--<![endif]-->
<!--[if IE]><link rel="stylesheet" href="ie.css"><![endif]-->

이 트릭은 Yandex (일명 "러시아 Google")를 사용하여 HTTP 요청을 줄입니다. Market.yandex.ru 예를 들어 이것을 사용합니다.

이 방법으로도 사용할 수 있습니다. 어느 때에도 코드 중간에 스타일을 작성 해야하는 조건이 작동하지 않을 수 있습니다.

<?php $browser = $_SERVER['HTTP_USER_AGENT']; ?>  
    <?php if (strstr($browser, "MSIE 6.0")) { ?>  
    <link rel="stylesheet" href="ie6style.css" type="text/css" media="screen" />  
    <?php }else{ ?>  
    <link rel="stylesheet" href="default.css" type="text/css" media="screen" />  
    <?php } ?>

을 체크하다 $browser 와 함께 :

즉 -“MSIE”

Firefox -“Firefox”

사파리 -“사파리”

오페라 - "오페라"

크롬 -“크롬”

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top