Thuộc tính background-attachment: fixed
background-attachment: fixed khiến hình nền **không cuộn cùng nội dung**, luôn cố định tại vị trí trong viewport. Tạo hiệu ứng parallax đơn giản.
Ví dụ minh họa
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-image: url("https://www.tutorialspoint.com/videotutorials/images/tutor_connect_home.jpg");
background-repeat: no-repeat;
background-attachment: fixed; /* Cố định hình nền */
background-position: right top;
min-height: 2000px; /* Tạo độ dài để cuộn */
}
</style>
</head>
<body>
<h1>Hình nền cố định (không cuộn)</h1>
<p>Cuộn trang để thấy hình nền đứng yên.</p>
</body>
</html>
Khi cuộn trang, hình nền đứng yên tại vị trí right top, nội dung trượt qua trên nó. Trên mobile, fixed đôi khi bị bỏ qua/tắt do hiệu năng, cần test kỹ.