
😢 내가 겪은 문제
이미지를 모자이크 처리하는 경우가 생각보다 많았다.
미리보기를 생성하거나, 로딩바를 생성했을 경우 또는 데이터 시각화를 통해 집중시키는 효과를 보고 싶을 때 사용하였다.
bulr 라는 단어는 생각이 나는데 잘 기억이 안나는 경우가 많아서 다른 사람들도 그렇지 않을까 싶어서 기록해둔다.
실제로 나는 잘 기억이 안나서 자꾸 검색해보게 되더라 ^^
filter: blur(5px);
-webkit-filter: blur(5px);
5px 만큼 모자이크 처리를 하는건데, 생각보다 5px 만큼만 해도 적당하니, 잘 조절해서 사용하면 될 것같다.
-webkit-filter 같은 경우에는 WebKit 기반 브라우저(예: 사파리)에 대응하기 위해 같이 사용해주는게 좋다.
'CSS' 카테고리의 다른 글
[CSS] Text 가로세로 가운데정렬 (0) | 2023.09.19 |
---|---|
[CSS] 이미지 정사각형 유지하는 방법 (0) | 2023.08.23 |
[CSS] 이미지 세로 중앙(수직) 정렬 하는 방법 (0) | 2023.08.21 |
[CSS] @media 사용하는 방법 (0) | 2023.08.17 |
[CSS] 높이 100% 하는 방법 (0) | 2023.08.17 |