web中html+CSS修改背景图片的不透明度

在web的开发中，要增加一张背景图片，但是图片不透明度太高看着很不舒服，所以有必要降低图片不透明度。但是在body中增加一张背景图片后，不能直接的修改图片不透明度。用div包裹body内容修改的不透明度是整一个div的。所以我个人的想法是采用一个div添加背景图片，直接让这张图片充满整个页面，而不是跟随着body内容大小设置背景图片。代码如下：
html代码：

<div class="my-background"></div>

css代码：

.my-background{
    position: fixed;
    height: 100%;
    width: 100%;
    background-image: url("../images/moroccan-flower.png");
    opacity: 0.3 ;
}

position设置为fixed，会固定在屏幕位置，根据height和width设置背景图片大小。如果将position改为absoluted，则最后只会根据屏幕的大小充满屏幕，对于屏幕下方的内容不会进行填充。
opacity为设置div的不透明度。因为div内没有放置内容，所以只会修改背景图片的不透明度，不会影响到内容。