Никита Егоров

У блока контент не указана ширина.

.content {
    width: 200px;
    // your code...
}

Нет, это работает наоборот, он загрузит ее, если ширина больше либо равна 500px.
Что бы она загрузилась при width <= 500px, то используйте max-width.

@media screen and (max-width: 500px) {
  body {
    background: url(...);
  }
}

Там просто фиксированный бэкграунд, который меняется в зависимости от прокрутки.
То есть через display: none/block скрывают/показывают. Впрочем все.

А зачем мучиться ?

Вот есть у вас блок, нужно вам сделать его 200px на 100px.

.block {
    width: 200px;
    height: 100px;
    background-color: skyblue;
}

И тут вам нужны внутренние отступы. Легче ведь просто указать
padding: 20px
Чем пересчитывать все и писать:

width: 180px;
height: 80px;
padding: 20px

Самый простой пример - https://jsfiddle.net/Svupol/3hfgykLo/2/

Ну например так:

Обычная горизонтальная прокрутка.

Вот самый простой пример:

--1GFNi

scoped css

Зачастую генерируют какие-то фрейворки, figma например юзает React

картинка состоящая из 10 картинок

Спрайт.

Берете, уменьшаете спрайт в 4 раза и через background-position ищете нужное изображение.
Вот статья - https://learn.javascript.ru/css-sprite

У блоков с display: inline-block есть свои отступы, их надо убрать, указав контейнеру font-size: 0;

Ну я сомневаюсь, что для этого есть видеоуроки.

У вас не указан размер блока.

.background_a {
    width: 200px;
    height: 200px;
    // Остальной ваш код
}

Почему бы дивам с изображениями не присвоить отдельный класс, например - content-img?

С помощью css найти все дивы с изображениями и изменить им стиль не получиться.

Да спасает, если задать position: relative

P.s Вместо ширины (width) вы указываете вес (weight).

Так?

Через флексы.

Вот подробный разбор - CSS vs. JS Animation: Which is Faster?

Рассматриваются анимации css, jq (animate), js (изменение дом) и Velocity.js, которая синхронизирует DOM и кеширует запросы к нему.

Но как бы делают не так...

Один раз настраивают все директории и все. Дальше только три команды ->

git clone url/to/project
npm i
npm run serve

Так делают почти все проекты, включая крупные фреймворки и популярные шаблоны.