[CSS] 드래그 (drag) 막기

웹 화면의 텍스트를 마우스로 드래그 할 수 없도록 막을 수 있다.

 

방법은 CSS에서 다음과 같이 설정한다.

-webkit-user-select :  ( none , text, all)

-moz-user-select: ( none , text, all) // Mozilla웹브라우저 한정

-ms-user-select: ( none , text, element) //MS 웹브라우저 한정

 user-select: ( none , auto, all, contain  ) 

 

예) 

   <p style="user-select:none">test</p> // 선택안됨
   <p style="user-select:auto">test</p> // 디폴트값 브라우저에서 허용시 선택가능
   <p style="user-select:all">test</p> // 더블클릭 안하고 클릭만 해도 선택가능
   <p style="user-select:text">test</p>// 텍스트 선택가능
   

 <p style="-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none">test</p>