Ankhena

Интерактивные онлайн курсы - рекомендую. Сколько-то первых курсов бесплатно, их хватит для начального толчка.

Для выравнивания по центру: Центрирование горизонтальное и вертикальное
Для блоков картинки + подписи используются теги figure и figcaption
Для ровных плиточек из картинок c подписями и пунктов меню на данный момент удобнее всего использовать flex

Дальше выкладываете свой код в песочницы типа jsfiddle с конкретными вопросами что не получается.

clip-path

Мое любимое решение - это множественный фон: снизу картинка (или 2 в зависимости от поведения содержимого блока), сверху линейный градиент под нужным углом (прозрачный-белый-прозрачный)

position и z-index
https://jsfiddle.net/t4vcr45a/
и какая разница бутстрап это или нет

Кстати, если речь об этом:


то зачем 2 картинки? Может это все таки одна картинка? ;)

Гугл -> "css tabs" или "jquery tabs"

1. Гугл и яндекс по запросу "слайдер на css"
2. Это учебный макет htmlacademy - если смотреть вебинары и т. д, то и как делать станет ясно.
3. Текст вставляется внутрь блока каждого слайда и позиционируется любым удобным вам способом.

План:
1. Составляется план хотелок (заказчиком или совместными усилиями).
2. План разбивается на части типа "хочу сейчас", "вторым эшелоном", "в далекой перспективе".
3. У пунктов плана ставятся галочки "реализуемо на wix" или нет.
4. Пишете альтернативные решения.
5. Вы озвучиваете срок и стоимость работ на wix и с помощью альтернативных решений.
6.
- Заказчик решает работать ли с вами вообще и по какому сценарию.
- Вы решаете хотите ли вообще иметь дело с таким заказчиком.
7. Выбранный план действий скрепляется кровью подписями.

1. Есть тег <picture> для показа разных изображений на разных экранах
2. height: auto для пропорций
3. позиционирование
4. object-fit для правильной обрезки, аналогичной bg size.

Про то, что картинки можно готовить заранее правильных пропорций лучше промолчу.

При наличии этого всего не понятно зачем нужна манипуляция превращения картинок в фон. Разве что кто-то знает js лучше, чем css.

Если использовать space-between, то чтобы последний ряд был как flex-start, то добавляют пустые блоки. Столько сколько максимально влезает блоков в строку -1.

У меня для этого специальный класс сделан

.empty-flex {
  height: 0;
  border: 0; //опционально, для универсальности
  text-decoration: none;  //опционально, для универсальности
}

https://jsfiddle.net/f4kk2p6e/ это чтоль надо? Или как оно должно себя вести при масштабировании?