Computer >> 컴퓨터 >  >> 프로그램 작성 >> CSS

CSS로 스크롤 고정 비활성화

<시간/>

웹 브라우저에서 제공하는 기본 스크롤 앵커를 비활성화하려면 overflowanchor를 사용할 수 있습니다. 재산.

예시

다음 예는 overflow-anchor 속성에 대한 아이디어를 제공합니다 -

<!DOCTYPE html>
<html>
<head>
<style>
body {
   overflow-anchor: none;
}
div{
   display: flex;
   flex-direction: row;
}
</style>
</head>
<body>
<div><img src="https://images.unsplash.com/photo-1613061588991-
6dd130548bc7?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=400&ixlib=rb1.2.1&q=80&w=160" />
<img src="https://images.unsplash.com/photo-1612129717112-
9d1274034547?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=400&ixlib=rb1.2.1&q=80&w=160" />
<img src="https://images.unsplash.com/photo-1613079936591-
8ce270890241?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=400&ixlib=rb1.2.1&q=80&w=160" />
<img src="https://images.unsplash.com/photo-1612454902143-
328050834c9e?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=400&ixlib=rb1.2.1&q=80&w=160" />
</div>
<h2>Test overflow</h2>
</body>
</html>

출력

이것은 다음과 같은 결과를 생성합니다 -

CSS로 스크롤 고정 비활성화