1

Подскажите пожалуйста, каков лучший способ сверстать подобный «забор».

Основные моменты (если понадобятся):

  1. Над забором просто однотонный бэкграунд

  2. Под забором — паттерн (т.е. бэкграунд через background-image задается)

2 ответа 2

3

Я бы разбил на слои: зелёный фон с забором, и каждая из этих полупрозрачных форм поверх, с разными ширинами, чтобы они накладывались друг на друга неповторяясь.

#zabor{
	background-image: 
		url(https://dl.dropbox.com/u/3533396/SO/multibg/bg-a.png), 
		url(https://dl.dropbox.com/u/3533396/SO/multibg/bg-b.png), 
		url(https://dl.dropbox.com/u/3533396/SO/multibg/bg-c.png), 
		url(https://dl.dropbox.com/u/3533396/SO/multibg/bg1.png);
	background-repeat: repeat-x;
	min-height: 300px;
}
<div id="zabor"></div>

2

Сделать отдельный слой, у макета забора найти повторяющуюся часть, обрезать и повторять через repeat-x.

Если не так, то лучше изложите свои "Основные моменты" на jsfiddle.

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.