встраивание картинки в css\html

[Raunchy]

Добрый вечер всем, у меня вопрос, как в css одну картинку положить на бэкграунд?
Вот у меня есть код бэкграунда
 

body {background-color:#ffecc7;

background-size: 100% 100%;

background-repeat: no-repeat;

 

}

 

Это у меня фон,он на весь экран но я хочу еще картинку\или некую область определенного цвета которая ляжет поверх этой, но будет меньшего размера.
Например я хочу зеленый "квадрат", который будет по центру этого фона, как это сделать?

[Jack_V]

Просто уменьшаете размер фона и назначаете картинку с квадратом ниже основного фона.
Можно еще квадрат сделать отдельным элементом или псевдоэлементом.

[Vlad]

Не очень понятно что конкретно вы желаете получить. Вариантов может быть несколько. Просто несколько картинок через один background можно вставить. Однотонные блоки через разные элементы или градиент.

[Raunchy]

А если я хочу просто область другого цвета наложить? 
Прописать ниже код с цветом просто?

А можно ли вписать градиент в данный отрезок кода?

 

Не очень понятно что конкретно вы желаете получить. Вариантов может быть несколько. Просто несколько картинок через один background можно вставить. Однотонные блоки через разные элементы или градиент.

Вы имеете в виду таким образом?
 

.gradient {height:50px; width:300px; background:url(../*PICTURE*.jpg) no-repeat;}

Edited August 24, 2015 by Raunchy

[Temiks]

Можно как то так http://jsfiddle.net/atemiks/wwq6s1hk/
Если правильно понял задачу..

[Raunchy]

Да, примерно так, благодарю..

[Vlad]

Какую область другого цвета? Круг, прямоугольник, квадрат? Приложите картинку что вам надо получить.

Если теоретически интересуетесь - то создаёте два элемента и накладываете их друг на друга. Для каждого элемента свой фон. Это пока самый простой вариант для вас.