Как правильно сверстать бэкграунд?

Question

[Антон Вихляев]

Как правильно сверстать подобные фоновые элементы? На ум приходит два варианта.

1. Можно создать див с фоном и с абсолютным позиционированием и поставить этот блок куда нужно, но это засоряет html лишними элементами.
   
2. Ставить фоном блока в css и позиционировать свойством background-position. Но в дизайне есть места, где этот листок наезжает на два блока и при таком позиционировании он не выйдет за границы блока.
   

Есть какие-нибудь другие варианты?

Comments

[WapSter]

Такими элементы дизайнеры обычно подразумевают, что они должны иметь параллакс

[Антон Вихляев]

Тимур Турсунбаев, вполне логично. Исходя, что у меня мало опыта в верстке, я даже и не подумал об этом. Спасибо за наводку!)

Answer 1

[GubinAlexey]

Не знаю, кто тебе запудрил голову, что это засоряет html. Для лендинга нормально твой 1-ый вариант. Плюс тебе подсказали что листочки это обычно паралакс, то для его использования по сути такая разметка и должна быть.

Для большых проектов используют модульную систему и дробят на минимодули. Типо кнопка, шапка, футер и тп. И у каждого своя разметка. Код каждого модуля маленький и легко читаемый, поэтому ничего не засоряется.