>  기사  >  웹 프론트엔드  >  CSS에서 텍스트를 선택 불가능하게 만드는 방법

CSS에서 텍스트를 선택 불가능하게 만드는 방법

王林
王林원래의
2020-11-13 09:21:263532검색

텍스트를 선택할 수 없음을 인식하는 Css 방법: [-webkit-user-select:none;-moz-user-select:none;]과 같은 사용자 선택 속성을 사용할 수 있습니다. 사용자 선택 속성은 콘텐츠의 선택 가능성을 제어하는 ​​데 사용됩니다.

CSS에서 텍스트를 선택 불가능하게 만드는 방법

속성 소개:

user-select는 콘텐츠의 선택성을 제어하는 ​​데 사용되는 CSS3 UI 사양의 새로운 기능입니다.

(학습 동영상 추천: css 동영상 튜토리얼)

속성 값:

auto - 기본값, 사용자가 요소의 콘텐츠를 선택할 수 있습니다.

none - 사용자가 요소의 콘텐츠를 선택할 수 없습니다.

text - 사용자는 요소 내에서 텍스트를 선택할 수 있습니다.

element - 텍스트는 선택 가능하지만 요소 경계 내에서만 선택 가능합니다(IE 및 FF에서만 지원됨)

all - 편집기 내에서 두 번 클릭/컨텍스트 클릭이 발생하는 경우 child 요소에서 해당 요소의 최상위 상위 요소가 선택됩니다.

-moz-none - Firefox 전용이므로 입력 입력 상자의 텍스트를 제외하고 요소 및 하위 요소의 텍스트를 선택할 수 없습니다. (이 기능은 onselectstart="javascript:return false;" 이벤트를 통해 구현됩니다. IE 브라우저 )

코드 샘플:

/*设置文字不能被选中     以下为css样式*/
-webkit-user-select:none;
   -moz-user-select:none;
   -ms-user-select:none;
   user-select:none;

관련 권장 사항: CSS 튜토리얼

위 내용은 CSS에서 텍스트를 선택 불가능하게 만드는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.