WebKit/Blink 브라우저의 macOS 트랙패드에서 스크롤 막대가 숨겨지는 것을 방지하려면 어떻게 해야 합니까?-CSS 튜토리얼-php.cn

WebKit/Blink 브라우저의 macOS 트랙패드에서 스크롤 막대가 숨겨지는 것을 방지하려면 어떻게 해야 합니까?

Mary-Kate Olsen

풀어 주다： 2025-01-04 08:45:33

원래의

453명이 탐색했습니다.

How Can I Prevent Scroll Bars from Hiding on macOS Trackpads in WebKit/Blink Browsers?

WebKit/Blink에서 macOS 트랙패드 사용자의 스크롤 막대 숨김 방지

macOS 버전 10.7 이후에서는 WebKit/Blink 브라우저(예: Safari) , Chrome)을 사용하지 않을 때 트랙패드 사용자로부터 스크롤 막대를 자동으로 숨깁니다. 이 동작은 요소의 스크롤 가능성을 결정하는 데 필수적인 시각적 신호를 모호하게 할 수 있습니다.

기본 WebKit 동작:

Foo<br />
Bar<br />
Baz<br />
Help I'm trapped in an HTML factory!</p>
<p></div> </p>
<p><strong>프레스토 동작(예: Opera):</strong></p>
<p><div><pre class="brush:php;toolbar:false">Foo<br />
Bar<br />
Baz<br />
Help I'm trapped in an HTML factory!</p>
<p></div></p>
<p><strong>해결책: 스크롤 막대를 영구적으로 표시</strong></p>
<p>스크롤 막대가 계속 표시되도록 하려면 WebKit, -webkit-scrollbar를 사용하여 모양 조작 의사 요소:</p>
<p><strong>CSS:</strong></p>
<pre class="brush:php;toolbar:false">.frame::-webkit-scrollbar {
    -webkit-appearance: none;
}

.frame::-webkit-scrollbar:vertical {
    width: 11px;
}

.frame::-webkit-scrollbar:horizontal {
    height: 11px;
}

.frame::-webkit-scrollbar-thumb {
    border-radius: 8px;
    border: 2px solid white;
    background-color: rgba(0, 0, 0, .5);
}

.frame::-webkit-scrollbar-track {
    background-color: #fff;
    border-radius: 8px;
}

로그인 후 복사

결과:

Foo
Bar
Baz
Help I'm trapped in an HTML factory!

작성자: 기본 스크롤 막대 모양을 비활성화하고 사용자 정의 스타일을 정의하여 macOS 트랙패드 사용자에게 스크롤 막대가 계속 표시되도록 합니다.

위 내용은 WebKit/Blink 브라우저의 macOS 트랙패드에서 스크롤 막대가 숨겨지는 것을 방지하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!