Question

让我们说我有一个包含

等通知消息的div

<div class="notification"></div>

消息是通过PHP动态生成的，如

<div class="notification><?php echo $notif;?></div>

但我希望那个div说它持有像

这样的通知

Notification: [notification message]

所以我输入了css：

.notification:before{
    content:'Notification: ';
}

问题是我可以为该div添加其他内容吗？例如，我想在通知

之前显示警告图片

所以可以先放另一个和

.notification:before{
     content:url(warning.png);
}

如果我确实喜欢那最后一个来了。那么如何展示它们呢？

Answer 1

您可以将图片设置为:before的背景，如下所示：

.notification:before {
    content: 'Notification: ';
    padding-left: 20px;
    background: url('warning.png') left center no-repeat;
}