CSS로 특정 브라우저를 타겟팅하는 방법

웹 브라우저는 서로 다른 렌더링 엔진으로 구축되며 이로 인해 브라우저 간에 웹사이트가 표시되는 방식에 약간의 차이가 발생합니다. 크기는 약간 다를 수 있으며, 색상은 일정하지 않으며, 그 밖의 많은 것들이 있습니다.

이에 대응하기 위해 다음 CSS를 사용하여 특정 브라우저를 대상으로 지정하고 스타일을 지정할 수 있습니다.

Chrome 및 Safari(웹킷)

@media screen and (-webkit-min-device-pixel-ratio:0) { 
    property: value;
}

파이어폭스

@-moz-document url-prefix() {
    .class {
        property: value;
    }
}

마이크로소프트 엣지

@supports (-ms-ime-align:auto) {
    .selector {
        property: value;
    }
}

IE11 이상

_:-ms-fullscreen, :root .ie11up { 
property: value; 
}

Reference

이 문제에 관하여(CSS로 특정 브라우저를 타겟팅하는 방법), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/stephanlamoureux/how-to-target-specific-browsers-only-with-css-3jog

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다