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

Question

[smiof]

Как правильно сделать это. это должен быть фон для страницы, в псд 1024

Answer 1

[Павел Гоголинский]

Можно фон залить зеленым, а снизу и сверху два треугольника на css серых

Comments

[smiof]

Как засунуть там где полоска изображения?

[Павел Гоголинский]

Зеленое изображение - это фон. Два треугольника - это два других элемента сверху и снизу. Можно before и after задействовать.

Answer 2

[Максим Тимофеев]

лучше svg растянуть

Comments

[smiof]

вырезать из пдфкы фон с изображением и конвертировать в СВГ .
или рисовать сначала в СВГ но тогда как мне внутрь картинку вставать ?

[Максим Тимофеев]

smiof: написать svg кодом - это оптимально. Если не оптимально - то конвертировать. AI умеет сохранять в svg.

[smiof]

(AI ???????) (а как в свг туда изображения засунуть там где полоска изображения ?)

[Максим Тимофеев]

smiof: AI = адоб илюстратор (программа такая). Вот тут подробно про svg: www.w3schools.com/svg/default.asp
Если туго с вебдизайном, просто сделайте картинкой .png, киньте на фон и растяните с помощью background-size:cover; или contain

[smiof]

в ПСД ширина 1024 растянуть не получиться, я сбросил как картинка должна быть

[Максим Тимофеев]

smiof: растягивать не надо, надо маштабировать (растягивать или уменьшать в зависимости от ширины блока) через background-size:cover;

[Максим Тимофеев]

smiof: странные ссылки, не пойду. Оформляйте код так: codepen.io/anon/pen/dXbzRg

[smiof]

Максим Тимофеев: если макет сделан там по бутстрап сетке просто контейнер и ров и блок с беграундом и мин хейдж и Ковером?

[smiof]

изображениям с радикала

[Максим Тимофеев]

smiof: bootstrap там или нет не имеет значения. ЕСли это фон сайта, то тогда цеплять надо не на div, а на body.

[Максим Тимофеев]

smiof: радикал - это кал с вирусней, прошу прощения за рифму