我想在页面的部分标题右侧放置一个分隔符,如下所示:

在此处输入图片说明

我试着这段代码,但是它是这样的:

在此处输入图片说明

这是代码:

<h4 class="section-title">Lastest From Blog</h4>

.section-title {
    font-size:18px;
    background-image: url('images/divider-bar.png');
    background-repeat: repeat-x;
    padding-bottom: 12px;
    color: #6c6c6c;
}

这是小提琴: http : //jsfiddle.net/Chead/hrYyg/

===============>>#1 票数:0

只需在标题中放置一个img标签,然后将文本与图像对齐

<h4 class="section-title">Lastest From Blog <img src="images/divider-bar.png" /></h4>

===============>>#2 票数:0 已采纳

你去了: http : //jsfiddle.net/KQdcr/

只需将您的文本换成带有白色背景的范围即可:

.section-title span { background: white; padding-right: 3px; }

当然,如果页面的背景不是纯色,这将不起作用。

===============>>#3 票数:0

在这里,你go 试试看。 调整容器和分隔线的宽度

  ask by Chead translate from so

未解决问题?本站智能推荐: