사용자 선택을 사용하는 방법은 무엇입니까? 기본값은 무엇입니까?-CSS 튜토리얼-php.cn

사용자 선택을 사용하는 방법은 무엇입니까? 기본값은 무엇입니까?

清浅

풀어 주다： 2019-05-14 17:04:27

원래의

9625명이 탐색했습니다.

user-select는 사용자가 텍스트를 선택할 수 있는지 여부를 설정하는 데 사용됩니다. 기본값은 텍스트를 선택할 수 있음을 의미합니다. 여기에는 세 가지 다른 속성 값이 있습니다. 아무것도 선택할 수 없음, 모든 콘텐츠를 전체적으로 선택할 수 있음, 요소를 선택할 수 있지만 요소 경계가 적용됨 사용자 선택 속성은 CSS3의 새로운 속성으로, 다음 속성을 설정하는 데 사용됩니다. 사용자는 텍스트를 선택할 수 있습니다.

사용자 선택을 사용하는 방법은 무엇입니까? 기본값은 무엇입니까? Syntax

user-select:none | text | all | element

로그인 후 복사

기본값: text

적용 범위: 대체 요소를 제외한 모든 요소

값 설명

none: 텍스트를 선택할 수 없음

text: 텍스트를 선택할 수 있음

all: 모든 콘텐츠 전체적으로 선택할 수 있습니다. 하위 요소를 두 번 클릭하거나 상황에 따라 클릭하면 선택한 부분은 해당 하위 요소에서 역추적되는 가장 높은 상위 요소가 됩니다.

요소: 텍스트를 선택할 수 있지만 선택 범위는 요소 경계에 의해 제한됩니다

Explanation

1. IE6-9는 이 속성을 지원하지 않지만 레이블 속성 onselectstart="return false;" 사용을 지원합니다. user-select :none 효과를 얻기 위해 Safari와 Chrome도 이 태그 속성을 지원합니다.

2. 이 속성은 Opera12.5까지는 아직 지원되지 않지만 IE6-9와 마찬가지로 선택 불가능 개인 태그 속성의 사용도 지원합니다. ="on" -select:none의 효과는 off입니다.

3. Chrome 및 *Safari를 제외하고 다른 브라우저에서는 텍스트가 -ms-user-로 설정되어 있습니다. 선택:없음; 사용자는 이 텍스트 블록에서 텍스트 선택을 시작할 수 없습니다. 그러나 사용자가 페이지의 다른 영역에서 텍스트를 선택하기 시작하면 텍스트를 -ms-user-select:none *으로 설정하여 해당 영역 텍스트를 계속 선택할 수 있습니다. userSelect

예:

css 코드:

.box{
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

로그인 후 복사

html 코드:

<div class="box" onselectstart="return false;" unselectable="on">
    这是测试数据
</div>

로그인 후 복사

위 내용은 사용자 선택을 사용하는 방법은 무엇입니까? 기본값은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!