> 웹 프론트엔드 > CSS 튜토리얼 > CSS에서 `all: unset`과 `all: revert`의 주요 차이점은 무엇입니까?

CSS에서 `all: unset`과 `all: revert`의 주요 차이점은 무엇입니까?

Barbara Streisand
풀어 주다: 2024-11-16 12:03:03
원래의
904명이 탐색했습니다.
<p>What is the Key Difference Between `all: unset` and `all: revert` in CSS?

<p>CSS에서 all: unset과 all: revert의 차이점 이해

<p>CSS의 unset 키워드는 속성을 상속된 값으로 재설정하는 데 도움이 됩니다. 부모로부터 상속받는 경우, 상속하지 않는 경우 초기 값으로 상속됩니다. 즉, 첫 번째 경우에는 Inherit 키워드처럼 작동하고 두 번째 경우에는 초기 키워드처럼 작동합니다.

<p>반면 revert 키워드는 약간 다른 접근 방식을 취합니다. 계단식으로 연결된 속성 값을 현재 값에서 현재 스타일 원점에서 현재 요소로 변경하지 않은 경우의 값으로 되돌립니다.

<p>이제 강조 표시된 차이점을 자세히 살펴보겠습니다. MDN에서 제공된 인용문:

<p>브라우저 및 사용자 정의 스타일시트

<p>주요 차이점 unset과 revert 사이에는 브라우저 또는 사용자가 생성한 사용자 정의 스타일시트(브라우저 측에서 설정)에 의해 설정된 값이 있는 속성을 처리하는 방법이 있습니다.

<p>모두 사용하는 경우: unset, 브라우저 설정 또는 사용자 -속성에 대한 설정 값은 상속된 값이나 초기 값으로 대체됩니다. 대조적으로 all: revert는 브라우저나 사용자 스타일시트가 개입되기 전의 특정 속성을 해당 상태로 되돌리는 기능이 독특합니다.

<p>

<p>다음 CSS 스니펫을 고려하세요. :

p {
  margin: 50px;
}
로그인 후 복사
<p>이 브라우저가 이 기본 여백 스타일을 모든 개체에 적용한다고 가정해 보겠습니다. <p> 강요. 이제 다음을 사용하면

<p>
로그인 후 복사
로그인 후 복사
<p>브라우저가 기본 스타일을 적용하지 않은 것처럼 여백 속성이 원래 상태로 되돌아갑니다.

<p>그러나 다음을 사용하면

<p>
로그인 후 복사
로그인 후 복사
<p>여백을 상속된 값(일반적으로 0)으로 재설정합니다. 따라서 이 경우 unset은 그러나 revert는 그럴 것입니다.

<p>결론적으로 all: unset은 속성을 상속된 값이나 초기 값으로 재설정하는 데 중점을 두는 반면, all: revert는 브라우저나 사용자 스타일시트를 수정하기 전에 속성을 원래 상태로 복원하는 데 중점을 둡니다.

위 내용은 CSS에서 `all: unset`과 `all: revert`의 주요 차이점은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿