텍스트를 투명하게 처리

Question

텍스트가 선택되지 않도록하려면 텍스트 위에 어떻게 투명한 이미지를 넣으시겠습니까? 학생들에게 복사/붙여 넣기뿐만 아니라 볼 수있는 내용을 입력하길 바랍니다.

원본을보고 복사하거나 붙여 넣기에 대해 걱정하지 않아도됩니다. 잘 아는 사람이라면 자료를 알면 걱정할 필요가 없습니다.

Answer 1

나는 이것이 훌륭한 아이디어라고 생각하지 않으며, 특히 잘 작동하지 않을 것이다. 또한, 당신은 내가 다음과 같이 추측거야, 사용중인 요소 보지 않고 :

<p>Something not to copy...<img src="path/to/image.png" /></p> 

CSS :

p { 
    position: relative; 
} 

p img { 
    position: absolute; 
    top: 0; 
    left: 0; 
    right: 0; 
    bottom: 0; 
    width: 100%; 
    height: 100%; 
} 

JS Fiddle demo.

약간 쉬운 방법 :

p { 
    -webkit-user-select: none; 
    -khtml-user-select: none; 
    -moz-user-select: none; 
    -o-user-select: none; 
    user-select: none; 
} 

JS Fiddle demo.

약간 더 신뢰할 수있는 방법 (즉, 업데이트/'현대의 브라우저에 의존하지 않지만, 자바 스크립트 사용하기 때문에하는이 질문에 요구되지 않습니다.

var paras = document.getElementsByTagName('p'); 

for (var i=0, len=paras.length; i<len; i++){ 
    paras[i].onmousedown = function(){ 
     return false; 
    }; 
} 

JS Fiddle demo을

Answer 2

투명 이미지의 z- 인덱스 값을 높이면 더 간단한 방법으로 처리 할 수 ​​있습니까?

웹 사이트 접근성의 '정신적으로'는 아니지만 제안하는 흥미로운 개념입니다.)