html - 拆分标题 CSS

Question

我想要一些关于如何完成将网站标题放在一起的输入；导航背景的宽度应该是 100%，但问题是试图实现徽标形状周围的透明度。

我正在使用一个 960 像素宽的容器，我希望徽标出现在左侧，然后继续使用绿色导航背景。关于如何使用 CSS 完成此任务的任何想法？

这是模型，因此您可以看到所需的结果：

我为“建设中”页面使用了一个临时解决方案，这是它的快照，也许这会为您指明正确的方向：

Answer 1

这是制作此http://jsfiddle.net/fxQej/的快速版本。可能有一种更快的方法，但至少这个方法有效。

HTML：

<div class="container">
    <div class="back">
        <div class="nav"></div>
    </div>
</div>

CSS：

.container {
    width:960px;
    height:500px;
    background-color:blue;
}
.nav {
    width:960px;
    height:90px;
    background-image:url('http://i43.tinypic.com/n650qq.png');
    background-repeat:no-repeat;
    background-position:70px 0px;
}
.back {
    width:960px;
    height:90px;
    background-image:url('http://i39.tinypic.com/25inc3p.png');
    background-size:960px 45px;
    background-repeat:no-repeat;
    background-position:0px 25px;
}