`all: unset` 대 `all: revert`: 각각을 언제 사용해야 합니까?

DDD
풀어 주다: 2024-11-10 18:29:02
원래의
348명이 탐색했습니다.
<p>  `all: unset` vs. `all: revert`: When Should You Use Each?

<p>CSS의 뉘앙스: all: unset vs. all: revert

<p>CSS 키워드 간의 미묘함을 이해하면 스타일 지정 능력이 향상될 수 있습니다. all: unset 및 all: revert의 경우 브라우저 적용 및 사용자 정의 스타일시트 처리에 차이가 있습니다.

<p>all: unset

<p>As MDN에 명시된 unset을 사용하면 속성을 부모로부터 상속된 경우 상속된 값으로 재설정하고 그렇지 않은 경우 초기 값으로 재설정할 수 있습니다. 결과적으로 전자 시나리오에서는 상속 키워드를 후자에서는 초기 키워드를 에뮬레이트합니다.

<p>all: revert

<p>반대로, revert는 속성의 계단식 값을 다음으로 되돌립니다. 해당 상태에는 현재 요소가 수정되지 않았습니다. 즉, 속성을 상속된 값으로 재설정하거나 속성이 없는 경우 브라우저의 스타일시트 또는 적용 가능한 사용자 스타일에 의해 설정된 기본값으로 재설정합니다.

<p>주요 차이점

<p>브라우저가 기본 스타일을 요소에 적용할 때 주요 차이점이 나타납니다. 되돌리기를 사용하면 이러한 스타일을 효과적으로 취소할 수 있지만 설정 해제를 사용하면 실행 취소되지 않습니다.

<p>그림

<p>다음 HTML 및 CSS 코드 조각을 고려하세요.

<p>
로그인 후 복사
<p>브라우저가 자동으로 50px의 기본 여백을 <p> 강요. 이 경우 margin:revert가 포함된 단락 내의 텍스트는 여백이 0px로 재설정되어 브라우저의 기본 스타일이 효과적으로 제거됩니다. 반면에 margin:unset이 있는 단락 내의 텍스트는 브라우저의 기본 여백인 50px를 유지합니다.

위 내용은 `all: unset` 대 `all: revert`: 각각을 언제 사용해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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