设置div背景图像的不透明度

时间:2019-08-02 17:45:19

标签: css

我试图设置图像的不透明度,该图像是div的背景图像。当我使用opacity = 0.5时,它说“ CSS不了解不透明度”。

.main
{
     background-image: url('../Images/MainBackground.jpg');    
     height: 100%;
     opacity=0.5;
     padding: 0px 12px;
     margin: 12px 8px 8px 8px;
     min-height: 420px;   
}

然后,将代码从网站管理员页面更改为一个单独的CSS文件,如下所示。

SELECT  
CONCAT(CAST(DATE_ADD(Day, INTERVAL(1-DAYOFWEEK(Day)) DAY) AS DATE),
    ' To ',
    CAST(DATE_ADD(Day, INTERVAL(1-DAYOFWEEK(Day))+6 DAY) AS DATE)) Week, 
COUNT(CASE WHEN Product = 'a' THEN 1 ELSE NULL END) as a,
COUNT(CASE WHEN Product = 'b' THEN 1 ELSE NULL END) as b
FROM table_1
GROUP BY 
CONCAT(CAST(DATE_ADD(Day, INTERVAL(1-DAYOFWEEK(Day)) DAY) AS DATE),
    ' To ',
    CAST(DATE_ADD(Day, INTERVAL(1-DAYOFWEEK(Day))+6 DAY) AS DATE))
,YEAR(Day);

这里也说CSS不知道不透明性。

我想将div背景图像的不透明度设置为0.5。有帮助吗?

我正在使用VS 2010(C#4.0)

1 个答案:

答案 0 :(得分:0)

尽管其他答案在技术上是正确的,但在您的情况下,您希望背景的不透明性而不是整个.main容器的不透明性。您不能设置背景图像的不透明度而不影响页面的子元素。如果您使用白色背景,则可以创建一个宽度和高度为100%的子元素,其不透明白色背景将包含内部数据。

<div class="main">
    <div class="opaque">
        // your content here
    </div>
</div>

rgba颜色为“白色”且不透明度为0.5的样式

<style>
    .main {
        background-image: url('../Images/MainBackground.jpg')
    }

    .opaque {
        height: 100%;
        width: 100%;
        background-color: rgba(255, 255, 255, 0.5)
    }
</style>