Мне нужно добавить фоновую картинку "image1.png". Картинка 1920 на 1080. Должна быть на весь экран и позиционирование идти по центру. Нужно сделать так, чтобы если у пользователя картинка обрезается в силу разного разрешения экрана, он мог, используя полосы скролинга по горизонтали и вертикали, посмотреть картинку полностью.
Как это можно реализовать? Набросал такой код, но все равно картинка частична обрезается и при скролинге не получается рассмотреть картинку полностью. (работает только по вертикали, а нужно и по горизонтали и по вертикали)
<!DOCTYPE html>
<html>
<head>
<title>Background Image</title>
<style>
body {
background-image: url("image1.png");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
height: 100vh;
overflow: scroll;
}
</style>
</head>
<body>
</body>
</html>