728x90
반응형
질문 : CSS로 Firefox 만 타겟팅
조건부 주석을 사용하면 브라우저 별 CSS 규칙으로 Internet Explorer를 쉽게 타겟팅 할 수 있습니다.
<!--[if IE 6]>
...include IE6-specific stylesheet here...
<![endif]-->
때때로 오작동하는 것은 Gecko 엔진 (Firefox)입니다. CSS 규칙으로 Firefox 만 타겟팅하고 다른 브라우저 하나만 타겟팅하는 가장 좋은 방법은 무엇입니까? 즉, Internet Explorer는 Firefox 전용 규칙을 무시해야 할뿐만 아니라 WebKit 및 Opera도 무시해야합니다.
참고 : '깨끗한'솔루션을 찾고 있습니다. JavaScript 브라우저 스니퍼를 사용하여 내 HTML에 'firefox'클래스를 추가하는 것은 내 생각에 깨끗한 것으로 간주되지 않습니다. 조건부 주석이 IE에만 '특별한'것처럼 브라우저 기능에 따라 달라지는 것을보고 싶습니다.
답변
이것은 아마도 가장 깨끗하고 쉬운 솔루션이며 JavaScript가 켜져있는 것에 의존하지 않습니다.
@-moz-document url-prefix() { h1 { color: red; } }
<h1>This should be red in FF</h1>
@-moz-document url-prefix() {
h1 {
color: red;
}
}
<h1>This should be red in FF</h1>
@-moz-document url-prefix() {
h1 {
color: red;
}
}
<h1>This should be red in FF</h1>
@-moz-document url-prefix() {
h1 {
color: red;
}
}
<h1>This should be red in FF</h1>
또 다른 Mozilla 특정 CSS 확장을 기반으로합니다. 바로 여기에 이러한 CSS 확장에 대한 전체 목록이 있습니다 : Mozilla CSS Extensions .
출처 : https://stackoverflow.com/questions/952861/targeting-only-firefox-with-css
728x90
반응형
'프로그래밍 언어 > HTML,CSS,JS' 카테고리의 다른 글
CSS 상자 그림자 하단만 보이기 (0) | 2021.06.24 |
---|---|
JavaScript에서 선택적 함수 매개 변수를 수행하는 좋은 방법 (0) | 2021.06.24 |
Value로 JavaScript 객체에서 키를 얻는 방법 (0) | 2021.06.23 |
Html.Partial vs Html.RenderPartial & Html.Action vs Html.RenderAction (0) | 2021.06.23 |
JavaScript에서 배열 요소 삭제 - delete vs splice (0) | 2021.06.22 |