background:url()透明度质量差

时间:2013-08-21 23:52:17

标签: html css

http://jsfiddle.net/vrJr9/

在上面的jsfiddle中,你可以看到我的影子不好,我在css中编辑了一条评论,你可以在其中取消注释,看看它与内容有什么相似:url()。我目前有2个困境,首先我可以使用内容:url()来获得正确的外观,但随后黑色图像被覆盖。或者我可以使用background:url()并且黑色占位符图像不会被掩盖但是我的透明阴影看起来像垃圾。所以,如果我能解决其中一个问题我很高兴。

以下是代码:

<div class="list_carousel">
    <ul id="foo2">
        <li>
          <a href="#"><img src="http://dummyimage.com/158x228/000/fff.png"></a>
        </li>
    </ul>
    <div class="clearfix"></div>    <a id="prev2" class="prev" href="#"><img src="image/images/carousel_control_03.png"/></a>
    <a id="next2" class="next" href="#"><img src="image/images/carousel_control_05.png"></a>

    <div id="pager2" class="pager"></div>
</div>

这是css:

.list_carousel {
    background-color: #fff;
    margin: 0 76px 30px 76px;
    width: 808px;
}
.list_carousel ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: block;
}
.list_carousel li {
    font-size: 40px;
    color: #999;
    text-align: center;
    background-color: #fff;
    border: 5px solid #fff;
    width: 180px;
    height: 250px;
    padding: 0;
    margin: 6px;
    display: block;
    float: left;
    background: url(http://i.imgur.com/jahcmyA.png) no-repeat 50% 100%;
    /* content: url(http://i.imgur.com/jahcmyA.png) */
}

1 个答案:

答案 0 :(得分:0)

好的,当我使用background:url()时,我想出了为什么丑陋的透明度;因为我有一个5px的寄存器可以切掉一切,所以它使透明度看起来像是方形边缘,我试图插入的图片太大了。一旦我调整了这两个设置,一切看起来都很干净。