Tumblr 블로그를위한 멋진 효과

"멋진"효과는 보는 사람의 눈에 달려 있습니다. 끈적 거리는 것은 다른 Tumblr 사용자에게 가장 멋진 효과 일 수 있습니다. 그러나 사용자 정의 효과를 결정한 후에는 테마의 소스 코드를 편집해야하므로 시작하기 전에 모든 효과에 대해 포함 된 자습서를주의 깊게 읽으십시오. 블로그에 적합한 균형을 찾으려면 여러 번 시도해야 할 수 있지만 최종 결과는 당신 만의 블로그 테마가 될 것입니다.

텍스트 효과

블로그에 약간 기발한 것을 추가하고 싶다면 Rainbow Text Generator를 사용하여 고전적인 무지개 팔레트에 링크를 만드는 것을 고려할 수 있습니다. 그러나 더 극적이고 미묘한 변화는 블로그의 분위기에 맞는 사용자 정의 글꼴을 사용하는 것입니다. Google Fonts는 간단한 산세 리프 글꼴에서 장식용 필기체 글꼴에 이르기까지 최소한의 수정으로 Tumblr 블로그에 적용 할 수있는 600 개 이상의 웹 지원 글꼴을 제공합니다. CSS를 사용하면 텍스트에 그라디언트 및 필터를 적용 할 수도 있습니다. (자료의 링크.)

이미지 효과

이미지는 Tumblr 경험의 큰 부분이며 CSS3를 사용하면 이미지가 페이지에 표시되는 방식을 쉽게 변경할 수 있습니다. 예를 들어 CSS의 hover pseudo-class를 사용하여 방문자가 이미지 위로 마우스를 가져갈 때 이미지가 표시되는 방식을 변경합니다. 다음 예제에서는 CSS Webkit 필터를 사용하여 마우스를 가져갈 때까지 모든 이미지를 회색조로 표시합니다.

img {-webkit-filter : grayscale (100 %);} img : hover {-webkit-filter : grayscale (0 %);}

CSS3는 세피아 톤, 흐림, 대비 관리 및 기타 기본 이미지 편집 효과와 같은 여러 필터를 제공합니다. Tuts +의 "Say Hello to Webkit 필터"기사에서는 이러한 필터와 사용 방법에 대해 설명합니다. (자료의 링크.)

커서 효과

사용자 지정을위한 또 다른 방법은 방문자의 커서를 변경하여 사용자의 초점에 시각적 인 관심을 불러 일으키는 것입니다. 예를 들어 방문자가 페이지를 클릭 할 때마다 작은 불꽃 놀이와 같은 폭발을 일으키는 Rainbow Fireworks 효과를 생각해보십시오. 또 다른 옵션은 Sparkle Cursor로 방문자의 커서에서 다채로운 반짝임을 떨어 뜨립니다. 세 번째는 방문자의 기본 마우스 커서를 대체 할 이미지를 업로드 할 수있는 사용자 지정 커서입니다. (자료의 링크.)

전체 페이지 효과

웹 사이트 Snazzyspace는 전체 블로그에 영향을 미치는 효과를 포함하여 Tumblr에 대한 여러 효과를 제공합니다. 한 가지 예는 방문자가 페이지를 처음으로로드 할 때 팝업되는 메시지입니다. 경고가있는 경우에 유용합니다 (예 : 작업에 안전하지 않은 콘텐츠). 또 다른 옵션은 눈이 내리는 애니메이션으로, 페이지 위에 눈송이를 떨어 뜨려 겨울 같은 느낌을줍니다. Snazzyspace는 또한 현재 방문자 수와 최고 방문자 수를 모두 보여주는 블로그 카운터를 제공합니다. (자료의 링크.)