HTML에서 JS를 사용하지 않고 이미지를 드래그하거나 선택할 수 없도록 하는 방법-HTML 튜토리얼-php.cn

HTML에서 JS를 사용하지 않고 이미지를 드래그하거나 선택할 수 없도록 하는 방법

PHPz

풀어 주다： 2023-09-03 08:09:06

앞으로

1263명이 탐색했습니다.

HTML에서 JS를 사용하지 않고 이미지를 드래그하거나 선택할 수 없도록 하는 방법

이미지 속성에 다음 코드 조각을 추가하고 이미지가 드래그되어 선택되는 것을 방지하세요.

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>

로그인 후 복사

위 내용은 HTML에서 JS를 사용하지 않고 이미지를 드래그하거나 선택할 수 없도록 하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!