内嵌三个div，中间固定宽度水平居中

Question

我正在设计响应式网站，内容为320像素到最大960像素宽度水平居中的div。现在我想做标题条，这是一个与屏幕宽度一样长的图像，在内容框中不受影响，但希望其余的，在这个960px条带之外被涂黑。这张图片会更好地解释它：

我首先尝试做线性渐变，但我不知道断点的确切位置。我尝试过黑色，半透明的div，但无法正确地做到这一点。

有没有办法用纯css3做这个或者我必须使用js / jquery？提前谢谢。