CSS 标题样式

Question

只是想知道如何像所附图片那样设置页眉样式。正在考虑使用两个 div，左侧用于文本，右侧用于水平重复图像。问题是我需要根据不同的 header 长度来更改正确的 div 宽度。

如有任何帮助，我们将不胜感激!

header image

Answer 1

你可以简单地做到这一点；

.header{
    width:100%;
    height:20px;
    background:url('http://jsfiddle.net/favicon.png') repeat;
}
.header span{
    background-color:#FFF;
    display:inline-block;
    height: 20px;
}

<div class="header"><span class="title">Header Text</span></div>

您可以将其包含在不同的页面中，标题空间会相应地调整大小。

Here 是一个有效的现场演示