Computer >> Máy Tính >  >> Lập trình >> CSS

Tắt tính năng neo cuộn bằng CSS

Để vô hiệu hóa neo cuộn mặc định do trình duyệt web cung cấp, chúng tôi có thể sử dụng tràn kết nối tài sản.

Ví dụ

Ví dụ sau đây cung cấp ý tưởng về thuộc tính cố định tràn -

<!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>

Đầu ra

Điều này sẽ tạo ra kết quả sau -

Tắt tính năng neo cuộn bằng CSS