具有attr背景图像的伪元素

Question

我有一些DIV，什么应该是空的，并且从父属性获取宽度背景源之后包含伪元素。 这是示例：html

<div class="slide-image" href="#adad" data-src="some-src"></div>

的CSS

   .slide-image {
        overflow: hidden;
        height: 100%;
        width: 100%;
    }
    .slide-image:after {
        content: "";
        background-color: #c2c2c2;
        display: inline-block;
        color: red;
        height: 100%;
        width: 100%;
        background-image: attr(data-src url);
    }

我尝试了许多其他方法，但无法使其正常工作。

Answer 1

您需要用和固定固定DIV。 例如：

<div style="width: 200px; height: 200px;">
    <div class="slide-image" href="#adad" data-src="some-src"></div>
</div>

或将.slide-image固定为和高度。

参见示例：

http://jsfiddle.net/SupY8/