문제 :

the : not () 셀렉터는 인수에서 여러 레벨을 지정할 때 예상대로 작동하지 않습니다. 이 예에서 :

em : not (div) { 색상 : 빨간색 } em : not (p div) { 색상 : 파란색 }

Safari renders the text in blue, while Chrome and Firefox use red.

em:not(div) {
    color: red
}
em:not(p div) {
    color: blue
}

The root cause is Safari's recent implementation of the level 4 :not() selector, which allows complex selectors as arguments. 반면에 Chrome and Firefox는 현재 버전의 단일 레벨 인수 만 지원합니다 : not (). 이 경우 "P Div"는 후손 조합으로 분리 된 2 개의 복합 선택기 ( "P"및 "Div")로 구성된 복잡한 선택기입니다. "P"요소 내부에 중첩.

현재 상태 :

Chrome과 Firefox는 결국 새로운 사양을 채택하여 브라우저에서 일관된 동작으로 이어질 것으로 예상됩니다. 그때까지 개발자는 다음을 사용할 때 잠재적 인 불일치를 알고 있어야합니다.이 브라우저에서 여러 레벨을 가진 () 선택기