WebKit 브라우저에서 항상 세로 스크롤 막대를 표시하는 방법은 무엇입니까?

항상 세로 스크롤 막대 표시

특정 웹 디자인에서는 사용자가 div 요소에서 스크롤 가능한 콘텐츠를 쉽게 식별할 수 있도록 하는 것이 중요합니다. Overflow-y:scroll 설정에도 불구하고 macOS와 같은 특정 운영 체제에서 적극적으로 사용되지 않을 때 세로 스크롤 막대가 표시되지 않을 수 있습니다.

해결책:

세로 스크롤 막대가 항상 표시되도록 하려면 다음 CSS 속성을 사용하세요.

::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 7px;
}

::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background-color: rgba(0, 0, 0, .5);
  box-shadow: 0 0 1px rgba(255, 255, 255, .5);
}

이러한 스타일은 WebKit 기반 macOS의 Safari 및 Chrome과 같은 브라우저. 스크롤바의 모양을 사용자 정의하면 스크롤바를 더욱 눈에 띄게 만들고, 활발하게 사용하지 않을 때에도 스크롤 가능한 콘텐츠가 있음을 표시할 수 있습니다.

위 내용은 WebKit 브라우저에서 항상 세로 스크롤 막대를 표시하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!