相关疑难解决方法(0)

如何在现有div中的文本左侧和右侧设置HR样式？

像这样的东西:

--- Header Stuff -----------------------------------

如何创建中心<h1>与<hr/>两侧在一个背景图像？

我还需要它处理各种长度的文本，可以很好地缩放以进行移动查看，并<hr/>使其容器的宽度达到100％。

我想要这种外观，但要覆盖背景图片。

对于在两边带有线条的文本，有很多答案（在这里，在 这里和在这里），但是它们都依赖于在文本后面使用纯色背景色，这对我来说不起作用，因为我要放置此页面上有背景图片。

这是我实现上述外观的方式，该外观可以处理各种长度的文本并可以很好地缩放：

的CSS

.title-box {
    height: 2px; 
    background-color: rgb(215, 0, 0); 
    text-align: center;
}
.title-outer {
    background-color:rgb(230, 230, 230); 
    position: relative; 
    top: -0.7em;
}
.title-inner {
    margin:0px 20px; 
    font-size: 17.5px; 
    font-weight:bold; 
    color:rgb(100, 100, 100);
}

的HTML

<div class="title-box">
    <span class="title-outer">
        <span class="title-inner">OUR STORY</span>
    </span>
</div>

我曾尝试下面的方法，它样的作品，但它并不能很好地因处理各种文本的宽度或规模<h1>和<hr/>S IN单独为<div>S：

的HTML

<div class="row">
    <div class="span4"><hr /></div>
    <div …