Question

我想在我的图像周围显示渐变样式。这有效。当图像不存在时，即src =“”那么我还是想显示这种渐变样式吗？

HTML

<style>
    .mystyle
    {
        position: relative;
        float: right;
        right: -1px;
        margin: 0;
        padding: 12px 0;
        background-image: -moz-linear-gradient(left,rgba(255,255,255,1) 0%,rgba(255,255,255,.625) 50%,rgba(0,0,0,.25) 100%); /*FF3.6+*/
        background-image: -webkit-gradient(linear,left top,right top,color-stop(0%,rgba(255,255,255,1)),color-stop(50%,rgba(255,255,255,.625)),color-stop(100%,rgba(0,0,0,.25))); /*Chrome,Safari4+*/
        background-image: -webkit-linear-gradient(left,rgba(255,255,255,1) 0%,rgba(255,255,255,.625) 50%,rgba(0,0,0,.25) 100%); /*Chrome10+,Safari5.1+*/
        background-image: -o-linear-gradient(left,rgba(255,255,255,1) 0%,rgba(255,255,255,.625) 50%,rgba(0,0,0,.25) 100%); /*Opera 11.10+*/
        background-image: -ms-linear-gradient(left,rgba(255,255,255,1) 0%,rgba(255,255,255,.625) 50%,rgba(0,0,0,.25) 100%); /*IE10+*/
        background-image: linear-gradient(left,rgba(255,255,255,1) 0%,rgba(255,255,255,.625) 50%,rgba(0,0,0,.25) 100%); /*W3C*/
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff',endColorstr='#40000000',GradientType=1); /*IE6-9*/
    }
</style>
<div id="mydiv" class="mystyle">
    <img id="img1" src=Chrysanthemum.jpg style="border-width: 0px;">
</div>

Answer 1

您可以opacity向IMG提供img { opacity:0.4; filter:alpha(opacity=40); /* For IE8 and earlier */ }：

{{1}}

如何显示透明图像？

1 个答案: