JavaScript를 사용하지 않고 클릭 시 이미지 소스를 동적으로 수정하는 CSS 전용 방법

Question

CSS만 사용하여 마우스 클릭 시 이미지의 src를 변경해야 합니다. 좋아요

img:active {
}

Answer 1

요소 교체 함수 content 속성을 사용하여 이를 달성할 수 있습니다.

이 기술을 사용하면 ARIA 또는 기타 접근성 관련 기능을 설정할 수 없으므로 전달하는 정보가 사용자 기반의 일부에서 손실될 수 있습니다. (이는 정보가 무엇인지, 귀하가 누구인지, 귀하가 통제/판매 대상인지에 따라 불법일 수 있습니다.)

키보드 등을 통해 액세스할 수 있도록 tabindex을 설정하거나 이미지를 버튼으로 감싸는 것이 좋습니다.

또한 어떤 경우에는 :active 表示“单击时”而不是“单击后”。 CSS 没有“点击后”伪类（尽管 :focus로 충분하다는 점에 유의하세요.)

으아악 으아악