이미지 속성에 다음 코드 스니펫을 추가하고 이미지가 드래그 및 선택되는 것을 방지합니다.
img {
user-drag: none;
user-select: none;
-moz-user-select: none;
-webkit-user-drag: none;
-webkit-user-select: none;
-ms-user-select: none;
} 텍스트 또는 이미지를 더블 클릭하면 강조 표시됩니다(선택됨). 이를 방지하기 위해 사용자 선택 속성을 사용할 수 있습니다. 이 속성을 없음으로 설정하면 이미지가 선택(강조)되는 것을 방지할 수 있습니다.
예시
다음 코드를 실행하여 이미지가 선택되지 않도록 할 수 있습니다. -
<!DOCTYPE html>
<html>
<head>
<style>
img {
-drag: none;
user-select: none;
-moz-user-select: none;
-webkit-user-drag: none;
-webkit-user-select: none;
-ms-user-select: none;
}
</style>
</head>
<body>
<img src = "https://www.tutorialspoint.com/images/python3.png" alt = "Python" width = "62" height = "62">
</body>
</html>