jquery - 更改Jumbotron的不透明度并使其全宽，而不会影响字体和按钮

想问一下如何更改Jumbotron的不透明度并使其全宽而不影响字体和按钮的不透明度吗？

.jumbotron-special{
    text-align: center;
    background-attachment: scroll;
    background-image: image-url('header-bg.jpg');
    background-position: center center;
    background-repeat: none;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    // how to only make background-image-opacity: 0.3;
}

最佳答案

您可以在另一个元素中添加背景，并仅降低该元素的不透明度：

.jumbotron-special {
   position: relative;
}
.jumbotron-special:after {
    content : "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url('header-bg.jpg');
    width: 100%;
    height: 100%;
    opacity : 0.3;
    z-index: -1;
}