Как верстать такие блоки?

Question

[Levott]

Я новичок в верстке, верстал макеты и все было нормально, но потом пошли вот такие блоки которые я не понимаю как верстать(прикладываю три скрина) и в ютубчике никто этого не объясняет, поэтому решаю обратиться к гуру программистам здесь. Помогите пожалуйста, вообще не допираю как их верстать.

Comments

[Ankhena]

Обычные фоновые картинки.

Тексты на последнем скрине абсолютами или гридами.

Answer 1

[GeKskill]

Экспортируете граф. элементы в svg/png. Оборачиваете эти блоки в какой-нибудь div.wrapper с position:relative. Создаете дочерний div { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }, а в этот div уже картинку img { width: 100%; height: 100%, object-fit: cover; } или background на дочерний, который с абсолютом.

Answer 2

[Oxygen32]

через position: absolute

Comments

[Levott]

Понятнее не стало

Answer 3

[scoffs]

На первых двух скринах подойдет displey: flex
На третьем было бы неплохо увидеть полный скрин, в теории там просто текст по центру, а названия планет через positio: absolute