이를 달성하려면 부모 div : 하나는 배경과 내용을 위해 두 개의 중첩 된 div를 만듭니다. 부모 div에 "위치 : 상대"를 지정 및 "위치 : 절대; 상단 : 0px; 오른쪽 : 0px; 맨 아래 : 0px; 왼쪽 : 0px;" (또는 높이/너비를 100%로 설정) 배경 div. 이를 통해 배경 DIV는 배경 요소를 컨텐츠 요소에서 분리하여 배경 DIV를 완전히 다루게되며 배경에 적용되는 블러 필터는 텍스트 또는 다른 원하는 내용을 포함하는 자식 요소에 영향을 미치지 않습니다.
예는 다음과 같습니다.
위치 : 상대;
높이 : 100px;
너비 : 100px;
}
#background {
위치 : 절대;
상단 : 0;
왼쪽 : 0;
오른쪽 : 0;
하단 : 0;
배경색 : 빨간색;
필터 : 블러 (3px);
Z- 인덱스 : -1;
}