>웹 프론트엔드 >CSS 튜토리얼 >WebKit/Blink 브라우저를 사용할 때 Mac 트랙패드에서 스크롤 막대가 사라지는 것을 방지하려면 어떻게 해야 합니까?

WebKit/Blink 브라우저를 사용할 때 Mac 트랙패드에서 스크롤 막대가 사라지는 것을 방지하려면 어떻게 해야 합니까?

Patricia Arquette
Patricia Arquette원래의
2024-12-08 10:26:11245검색

How Can I Prevent Scroll Bars from Disappearing on My Mac Trackpad When Using WebKit/Blink Browsers?

스크롤 막대가 사라지는 것을 방지하기: WebKit/Blink에서 Mac 트랙패드 사용자를 위한 솔루션

문제:

Mac OS X Lion(10.7) 및 macOS 사용자 나중에 WebKit/Blink 브라우저(Safari 및 Chrome 등)에서 트랙패드를 사용할 때 숨겨진 스크롤 막대가 나타날 수 있습니다. 스크롤 막대는 요소가 스크롤 가능하다는 필수적인 시각적 신호를 제공하므로 이 동작은 혼란을 초래할 수 있습니다.

해결책:

WebKit의 -webkit-scrollbar 의사 요소를 사용하면 스크롤 막대 모양을 제어합니다. 이러한 요소를 사용자 정의하면 기본 동작을 방지하고 스크롤 막대가 계속 표시되도록 할 수 있습니다.

CSS 스타일 지정:

기본 모양과 동작을 비활성화합니다.

.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;
}

결론:

이 CSS 스타일을 구현하면 WebKit/Blink 브라우저에서 Mac 트랙패드 사용자에게 스크롤 막대가 계속 표시되도록 할 수 있습니다. 일관되고 직관적인 스크롤 경험을 제공합니다.

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

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