Как сделать лучше такой эффект?

Question

[AlexMark]

В голове только пока идея обрезать картинку еще, а потом в бг фон вставить снизу в блок, и повторить соответственно.
Или можно как-то по другому? (блок высотой в 500 пикселей, данный эффект только снизу)

Answer 1

[Олег]

Градиент под углом+наложить блок с градиаетом от верха(цвет) к низу(прозрачный).
https://jsfiddle.net/oh1ysLos/

Comments

[AlexMark]

пока смог сделать только так... https://jsfiddle.net/zdb15uun/1/
если меняю чтобы меняло к белому, то оно меняет цвет по все еще вверх по линии, а мне нужно, чтобы оно как бы отцветало вверх...
и еще я не очень понял что означают эти пиксели. поставив 75 150 я так понял в 1-вом случае я задал ширину 1 блока, а 150 перекрился наполовину и вышло тоже 75пкс, так?
а что за показатель в 10 пикс?

[HelpSophie]

Мне кажется, можно в один блок все сложить, а background'ы через запятую написать.

Answer 2

[frees2]

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

repeating-linear-gradient(<?php echo rand(20, 90); ?>deg, transparent, transparent 5px, rgba(143, 77, 63, 0.25) 5px,
rgba(143, 77, 63, 0.25) <?php echo rand(7, 21); ?>px);background-attachment:fixed; position:relative;max-width:2000px;}