누른 버튼 선택기
문제:
수정하고 싶은 시나리오가 발생했습니다. 눈에 띄는 시각적 피드백을 생성하기 위해 눌렀을 때 버튼의 모양. :active 의사 클래스를 사용하려고 시도했지만 버튼을 길게 클릭할 때만 스타일 변경이 발생합니다.
답변:
:active를 사용하는 동안 의사 클래스는 적합한 옵션처럼 보일 수 있으며, 요소를 적극적으로 누르는 동안 요소의 스타일을 지정하도록 특별히 설계되었습니다. 원하는 효과를 얻으려면 다른 접근 방식을 사용하는 것이 좋습니다.
앵커 요소 <버튼> 요소. 이는 초기 요구 사항과 정확하게 일치하지 않을 수 있지만 <버튼>:
CSS 코드:
<code class="css">a { display: block; font-size: 18px; border: 2px solid gray; border-radius: 100px; width: 100px; height: 100px; text-align: center; line-height: 100px; } a:active { font-size: 18px; border: 2px solid green; border-radius: 100px; width: 100px; height: 100px; } a:target { font-size: 18px; border: 2px solid red; border-radius: 100px; width: 100px; height: 100px; }</code>
HTML 코드:
<code class="html"><a id="btn" href="#btn">Demo</a></code>
위 내용은 클릭 시 지속적인 버튼 스타일 변경을 달성하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!