Question

是否可以在div背景之前显示图像？在这里我的代码：

<li class="contest55">
    <div class="view-image-fid"></div>
</li>

在我的CSS中我有：

#latest_ideas .contest55{
    background-image: url('images/image.png');
    background-size: Auto 185px;
    background-repeat:no-repeat;
    }

我需要在div-view-image-fid下面立即开始背景，宽度为250px

关于如何做的提示或想法？

Answer 1

您可以修改CSS：

.contest55 {
    background-image: url('images/image.png');    
    background-repeat:no-repeat;
    background-color: Orange;
    height:600px;
    width:300px;;
    display:inline-block;
    border:1px solid Black;
    }

必须调整高度和宽度，以便它们跨越＆＃39;背景图像的长度。您可以根据图像的大小更改这些值。

您可以在此处查看：http://jsfiddle.net/s25sm/1/

我在小提琴中添加了边框，使边界清晰可见。你可以删除它们以获得你想要的效果!!!

希望这有帮助!!!

Answer 2

http://jsfiddle.net/GqRGV/4/

通过使用：after伪选择器，背景图像将在图像之后开始。

 li {
     list-style: none;
 }
 .view-image-fid img {
   width: 250px;
   height: auto;
 }
 .view-image-fid:after {
  content:'';
  background-image: url('http://snag.gy/l4EaW.jpg');
  background-size: auto 185px;
  background-repeat:no-repeat;
  width: 250px;
  height: 185px;
  display:block;
 }

Answer 3

使用jquery

解决

<script>
    $( document ).ready(function() 
    {
        $(".views-image-fid").each(function()
            {
            if ($(this).find(".views-image-fid").length == 1)
            {
            $(this).parent().css("background-position","0 190px");
            }
            });
    });
</script>

在父div背景之前的css div图像

3 个答案: