[css] @ -moz-document url-prefix ()는 무엇을합니까?

Program / 글쓴이

Simon Collison의 새로운 이전 반응 형 웹 디자인 의 CSS에는 다음과 같은 몇 가지 선언이 있습니다.

@-moz-document url-prefix() {
  .fl { float:left; margin:12px 4px 0 0; padding:0; font-size:65px;  line-height:62%;  color:#ba1820; }
  .fs { float:left; margin:12px 4px 10px 0; padding:0; font-size:65px; line-height:62%; color:#ba1820; }
}

이것은 실제로 무엇을합니까? @ -moz-document url-prefix ()를 검색했으며 userchrome 내에서 사용에 대한 참조를 찾았지만 표준 사이트 스타일 시트는 아닙니다.

일반적으로 URL을 인수로 전달한 다음 선언 내용을 해당 URL로 제한합니다. 그러나 Colly의 사이트에는 전달되는 인수가 없습니다. 이것은 선언이 현재 URL 또는 임의의 URL에서 작동하고 있음을 나타냅니다. 그래서 여기서 우리가보고있는 것은 특정 규칙으로 Mozilla 전용 브라우저를 대상으로하는 방법 입니까?

답변

로 시작하는 모든 CSS at-rule @-moz-은 표준 규칙이 아닌 Gecko 엔진 관련 규칙입니다. 즉, Mozilla 전용 확장입니다.

이 url-prefix규칙은 포함 된 스타일 규칙을 URL로 시작하는 모든 페이지에 적용합니다. URL 인수없이 사용하면 모든 페이지에 @-moz-document url-prefix()적용됩니다 . 이는 실제로 Gecko (Mozilla Firefox)를 대상으로 하는 CSS 해킹 입니다. 다른 모든 브라우저는 스타일을 무시합니다.

다른 Mozilla 관련 확장 목록은 여기 를 참조 하십시오 .

답변

에서 https://developer.mozilla.org/en/CSS/@-moz-document

       @-moz-document url(http://www.w3.org/),
                   url-prefix(http://www.w3.org/Style/),
                   domain(mozilla.org)
    {
      /* CSS rules here apply to:
         + The page "http://www.w3.org/".
         + Any page whose URL begins with "http://www.w3.org/Style/"
         + Any page whose URL's host is "mozilla.org" or ends with
           ".mozilla.org"
       */

      /* make the above-mentioned pages really ugly */
      body { color: purple; background: yellow; }
}

답변

Firefox 59부터는 다음을 사용해야합니다.

@document url("https://www.example.com/")

이 속성의 -moz 프리픽스 버전 지원은 버그로 인해 웹 콘텐츠에 대해 중지되었습니다.

https://bugzilla.mozilla.org/show_bug.cgi?id=1035091

답변

@supports (-moz-appearance:none) {...}@-moz-document url-prefix() {...}그렇지 않은 경우 나를 위해 일했습니다 .

답변