Как передвигать картинки в CSS

Для передвижения картинок в CSS можно использовать свойство position и соответствующие значения:

1. position: static; — это значение по умолчанию, когда элементы располагаются в порядке, заданном в HTML-коде. При этом свойства top, bottom, left и right не работают.
2. position: relative; — позволяет задавать смещение элемента относительно его исходного положения с помощью свойств top, bottom, left и right.
3. position: absolute; — позволяет задавать точное положение элемента относительно его ближайшего родительского элемента с position: relative; или относительно всего документа, если такого элемента нет. Также можно использовать свойства top, bottom, left и right.
4. position: fixed; — позволяет задавать точное положение элемента относительно окна браузера. Также можно использовать свойства top, bottom, left и right.

Например, чтобы передвинуть картинку на 20 пикселей вниз и на 50 пикселей вправо, можно использовать следующий CSS-код:

img {
  position: relative;
  top: 20px;
  left: 50px;
}