blur()
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2016년 9월.
blur() CSS 함수는 주어진 이미지에 가우시안 블러를 적용합니다. 반환 값은 <filter-function>입니다.
시도해 보기
filter: blur(0);
filter: blur(4px);
filter: blur(1.5rem);
<section id="default-example">
<img
class="transition-all"
id="example-element"
src="/shared-assets/images/examples/firefox-logo.svg"
width="200" />
</section>
구문
blur(radius)
매개변수
예제
css
blur(0) /* 변화 없음 */
blur(8px) /* 8px 블러 */
blur(1.17rem) /* 1.17rem 블러 */