활용 사례
home
회사 브랜딩
home

콜아웃에 커스텀 이미지 배경 넣기!

크래프트 지 텍스처를 콜아웃에 적용했습니다.

페이지별 적용

1.
텍스처를 변경하시려면 background-image 안에 원하시는 텍스처 이미지 링크를 넣어보세요!
2.
콜아웃 내의 글자색을 변경하시려면 color: #fff 에 원하는 색상을 지정해 주세요!
<head> <style> .notion-callout-block { background-image: url("https://images.unsplash.com/photo-1615800098746-73af8261e3df?ixid=MnwxMjA3fDB8MHxzZWFyY2h8MjB8fHBhcGVyfGVufDB8MXwwfHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60"); background-size: cover; } .notion-callout-block * { color: #fff !important; background-color: transparent !important; } </style> </head>
HTML

전체 페이지 적용

우피 콘솔의 HEAD 영역에 아래 코드를 넣고 저장해 주세요.
<style> .notion-callout-block { background-image: url("https://images.unsplash.com/photo-1615800098746-73af8261e3df?ixid=MnwxMjA3fDB8MHxzZWFyY2h8MjB8fHBhcGVyfGVufDB8MXwwfHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60"); background-size: cover; } .notion-callout-block * { color: #fff !important; background-color: transparent !important; } </style>
HTML