CSS에서 텍스트 선택을 비활성화하는 방법

CSS에서 텍스트 선택을 금지하는 방법은 user-select 속성을 추가하고 속성 값을 없음으로 설정하는 것입니다. 즉, 특정 코드는 [user-select:none;]과 같습니다.

이 기사의 운영 환경: windows10 시스템, CSS 3, thinkpad t480 컴퓨터.

웹 브라우저에서 텍스트를 두 번 클릭하면 텍스트가 선택되거나 강조 표시됩니다. 그렇다면 이 행동을 금지하고 싶다면 어떻게 해야 할까요? 실제로는 매우 간단합니다. 다음 속성을 사용하면 됩니다.

사용자 선택 속성은 요소의 텍스트를 선택할 수 있는지 여부를 지정합니다.

웹 브라우저에서 텍스트를 두 번 클릭하면 해당 텍스트가 선택되거나 강조 표시됩니다. 이 속성은 이러한 동작을 방지하는 데 사용됩니다.

구문: ​​

user-select: auto|none|text|all;

속성 값:

• auto 기본값. 브라우저에서 허용하는 경우 텍스트를 선택할 수 있습니다.

• none 텍스트 선택을 방지합니다.

• text 텍스트는 사용자가 선택할 수 있습니다.

• all 더블클릭 대신 텍스트를 선택하려면 클릭하세요.

구현 코드는 다음과 같습니다.

PC측:

.not-select{
    -moz-user-select:none; /*火狐*/
    -webkit-user-select:none; /*webkit浏览器*/
    -ms-user-select:none; /*IE10*/
    -khtml-user-select:none; /*早期浏览器*/
    user-select:none;
}

모바일측:

.no-touch {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

관련 영상 공유: css 영상 튜토리얼

위 내용은 CSS에서 텍스트 선택을 비활성화하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!