티스토리는 설치형 블로그로써 다양한 스킨의 제작과
사용자 입맛에 맞게 HTML/CSS를 수정 할 수 있는 장점이 있습니다.
그 중 간단한 CSS수정으로 이미지에 다음과 같이 그림자 효과를 넣는 방법에 대해 알려드리겠습니다.
관리자 페이지의 HTML/CSS 편집 탭으로 들어가게 되면 style.css가 존재하는데
다음과 같이 imageblock클래스에 box-shadow를 추가해주시면 됩니다.
상세 설명을 드리면
5px - 가로길이 양수인경우 오른쪽, -숫자인경우 왼쪽으로
5px - 세로 양수인경우 밑으로, -숫자인경우 위로
10px - 그림자 길이인데 숫자가 낮으면 그림자의 흐림효과가 적으면서 길이가 짧고
높을수록 많이 흐려지고 거리도 멀어집니다. -숫자 값은 인식되지 않습니다.
rgba - 순서대로 r, g, b, 불투명도 입니다. 지금은 rgb값을 사용안하므로 0으로 지정하고
0.3의 불투명도 입니다. 값이 높을수록 그림자가 진해지며 -값은 적용되지 않습니다.
값을 수정하면서 마음에 드는 그림자 효과를 만들어보세요. ^^
'블로그' 카테고리의 다른 글
티스토리 플로팅 메뉴 만들기(왼쪽 메뉴, 스크롤 메뉴) (1) | 2014.02.03 |
---|---|
티스토리 태그목록 3D형식으로 출력하기 (0) | 2014.02.01 |
티스토리 카테고리의 다른글 위치변경하기 (0) | 2014.01.31 |
SyntaxHighlighter(블로그 소스꾸미기, 코드 하이라이터) (0) | 2014.01.19 |
Color Scripter(블로그 소스꾸미기, 코드 하이라이터) (0) | 2014.01.19 |