CSS 배경 이미지를 어둡게 합니까?

CSS 배경 이미지를 어둡게 합니까?

이 질문에는 이미 다음과 같은 답이 있습니다.

CSS를 사용하여 배경을 어둡게 하는 방법은 무엇입니까? (11개 답변)

마감됨7년 전에.

커뮤니티는 1년 전에 이 질문을 다시 시작할지 여부를 검토한 후 이 질문을 닫았습니다.

원래 종료 이유가 해결되지 않았습니다.

꽤 간단한 질문이어야 합니다.웹 사이트에서 다음 작업을 수행합니다.

#landing-wrapper {
    display:table;
    width:100%;
    background:url('landingpagepic.jpg');
    background-position:center top;
    height:350px;
}

제가 하고 싶은 것은 배경 이미지를 어둡게 하는 것입니다.저는 이 DIV 안에 UI 요소가 있기 때문에 다른 DIV를 배치하여 어둡게 할 수는 없을 것 같습니다.제안?

다음과 같은 배경 이미지와 함께 CSS3 선형 그라데이션 속성을 사용할 수 있습니다.

#landing-wrapper {
    display:table;
    width:100%;
    background: linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) ), url('landingpagepic.jpg');
    background-position:center top;
    height:350px;
}

다음은 데모입니다.

#landing-wrapper {
  display: table;
  width: 100%;
  background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('http://placehold.it/350x150');
  background-position: center top;
  height: 350px;
  color: white;
}

<div id="landing-wrapper">Lorem ipsum dolor ismet.</div>

언급URL : https://stackoverflow.com/questions/26621513/darken-css-background-image