如何制作徽标背景填充标题？

Question

我想知道如何完成here

这个徽标背景

如果您注意到徽标浮动到左侧以及白色＆＃34; D＆＃34;在红色背景上，填充标题的整个高度。我知道如何浮动它和所有东西，我只需要知道如何制作具有一定宽度的背景颜色来填充标题的整个高度，就像这样。顺便说一句，我假设标题已经没有设定高度。

提前致谢！

Answer 1

无论您的浮动div是用于徽标的id或类，只需将背景颜色应用于CSS中。

如果您正在寻找某种动态高度应用;将html，body和封闭div元素设置为'height：100％'。

发布代码示例会有所帮助。

Answer 2

你可能想尝试这样的事情（fiddle here）：

<强> HTML ：

<div id="Header">
    <img id="Logo" src="http://goo.gl/uDkk1X" />
</div>

<强> CSS ：

#Header {
    width: 600px;
    height: 60px;
    background: #333333;
}

#Logo {
    width: 60px;
    height: 60px;
    float: left;
    background: #666666;
}

如您所见，图像已经具有透明度，因此设置为此block的任何背景颜色都会在实际图像后面呈现。或者将img放在具有指定背景颜色的另一个容器中。