요즘 취미로 배우고 있는 웹 프론트엔드 수업에서 다음과 같은 설문지 폼을 작성해볼 기회가 있었다. 여기서 배경 이미지를 어떻게 구현할 것인가에 대해서 고민했었는데 이런저런 방법을 시도한 결과 아래처럼 나름대로 원하는 결과를 만들어낼 수 있었기에 그 과정을 포스팅해본다. 먼저 배경 이미지를 보면 특정 색조(예시에서는 파란색)로 씌인 것을 알 수 있다. 이를 구현하려면 배경 이미지의 opacity 속성을 조절하고 그 위에 컬러 필터같은 느낌으로 rgba()를 이용하여 조정된 알파값의 색을 씌워야 할 것이라 생각하고 진행하였다. 처음으로 생각한 방법은 전체 HTML 요소를 감싸는 div를 생성하여 해당 div의 background-image 속성에 이미지를 삽입 후 opacity 속성을 0.7 정도로 설정하는..
