프로필카테고리질문하기
로그인 계정 만들기

배경 이미지에 그라이언트 적용하는 방법

04 개월 전
CSS3 linear-gradient와 background-image를 같이 사용하려면 어떻게 해야 하나요?
.hero { background: linear-gradient(180deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3)); /* 그라디언트 */ background-image: url("background.png"); /* 이미지 */ }
답변하기 의견 추가
의견 (0)
더 많은 의견 보기

답글 (1)

394 개월 전
background-image에 이렇게 쉼표로 구분해서 입력할 수 있어요:
.hero-1 { /* 이미지 위에 그라디언트 */ background-image: linear-gradient(180deg, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0)), url("background.png"); } .hero-2 { /* 그라디언트 위에 이미지 */ background-image: url("background.png"), linear-gradient(180deg, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0)); }
의견 추가
의견 (0)
더 많은 의견 보기

정보

업보트
1
질문됨
4 개월 전
최근 활동
4 개월 전

카테고리

CSS