css - 文字后面的背景图片

Question

我正在尝试在每个段落的星期几之后显示图像，但仅显示部分背景图像。我以前尝试过填充，但可以使用一些帮助，因为我是 css 方面的新手。

html是：

    <section id="top">
    ...
    <p><span>Mon</span><span>Open</span></p>
    <p><span>Tues</span><span>6:30 pm</span>Bible Study</p>...

CSS是：

    #top p span:nth-child(1){
    font-family: 'Quintessential', cursive;
    font-size:25px;
    font-weight:normal;
    color:#fff;
    line-height: 59px;
    background-image:url('img/ribbon.png');
    background-repeat:no-repeat;
    }

Answer 1

SPAN 正在显示 DISPLAY: INLINE; 默认情况下。

尝试设置为 DISPLAY: INLINE-BLOCK;

以下是有关它们为何以这种方式工作的更多信息： http ://www.webdesignfromscratch.com/html-css/css-block-and-inline/