CSS에 초점을 잃는 스타일 요소를 위한 :blur 선택기가 있습니까?

CSS의 Focus 및 Blur 상태: :blur 선택기의 가용성

CSS에서 :focus 의사 클래스를 사용하면 스타일을 적용할 수 있습니다. 입력 필드나 버튼과 같이 초점이 맞춰진 요소에 적용됩니다. 그러나 많은 사람들은 포커스를 잃은 요소에 대해 CSS에 해당하는 :blur 의사 클래스가 있는지 궁금해할 수 있습니다.

대답은 CSS에는 :blur 의사 클래스가 없습니다입니다.

CSS에서 :focus를 포함한 의사 클래스는 요소의 현재 상태를 나타냅니다. :focus 의사 클래스는 요소의 포커스 상태를 나타내지만 포커스를 잃거나 포커스를 잃은 요소에 대한 스타일을 명시적으로 정의할 수 있는 방법은 없습니다.

이러한 제한은 표현에 대한 CSS의 접근 방식과 일치합니다. 사건보다는 상태. :focus, :hover 및 :active와 같은 의사 클래스는 상태 간 전환을 기반으로 스타일을 트리거하도록 설계되지 않았습니다. 대신 요소가 현재 있는 특정 상태를 나타냅니다.

초점에 있지 않은 요소의 스타일을 지정하려면 다음과 같은 CSS 기술을 사용할 수 있습니다.

• :not(:focus) 사용: 이 접근 방식을 사용하면 포커스가 없지만 브라우저가 적은 요소를 타겟팅할 수 있습니다. support.
• :focus로 스타일 재정의: 모든 요소에 대한 일반 스타일을 정의한 다음 포커스가 있는 요소에 대해 특정 스타일로 이를 재정의할 수 있습니다.

위 내용은 CSS에 초점을 잃는 스타일 요소를 위한 :blur 선택기가 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!