CSS pointer-events 속성을 사용하여 요소에서 마우스와 터치가 허용되는지 여부를 제어할 수 있습니다.
CSS 포인터 이벤트 속성의 구문은 다음과 같습니다 -
pointer-events: auto|none;
위,
자동 기본값입니다. 요소는 포인터 이벤트에 반응하는 반면
없음: 요소가 포인터 이벤트에 반응하지 않음
예시
다음 예는 CSS 포인터 이벤트 속성을 보여줍니다.
<!DOCTYPE html>
<html>
<head>
<style>
a {
margin: 10vh;
pointer-events: none;
}
a:last-of-type {
pointer-events: auto;
}
</style>
</head>
<body>
<a href=#>No pointer event here</a>
<a href=#>Automatic pointer event here</a>
</body>
</html> 출력
이것은 다음과 같은 결과를 생성합니다 -
예시
<!DOCTYPE html>
<html>
<head>
<style>
select {
margin: 10vh;
pointer-events: none;
background-color: mistyrose;
}
</style>
</head>
<body>
<select>
<option>No event here </option>
<option>a</option>
<option>b</option>
<option>c</option>
</select>
</body>
</html> 출력
이것은 다음과 같은 결과를 생성합니다 -
