페이드인 효과 지금 저의 티스토리 블로그에는 Fade-in 효과가 적용되어 있습니다. 게시글을 표현할 때 가장 예쁘게 표현할 수 있는 방법이 아닐까 생각합니다. 저와 같은 생각을 가지고 계신 분들에게 이글이 도움이 되었으면 합니다. /*이미지 스크롤 효과*/ figure.imageblock, #tt-body-page figure.imageblock,.image-container { opacity:0; } 위에 있는 CSS 코드를 복사하여 스킨편집 CSS 영역에 붙여 넣어줍니다. Fade-in 기능이 적용되는 범위는 이미지와 이미지를 2~3장 붙여 나열하는 imageblock과 container 두 가지입니다. 페이드인 적용 방법 위코드는 HTML 편집영역에서 코드 바로 위에 붙여 넣어주시면 완료입니다. ..>

반응형 블로그 또는 웹사이트에 적용하기 편한 방법입니다. 노출시키고 싶은 또는 감추고 싶은 요소를 컨트롤하는 방법은 많지만 그중에 가장 간단하게 적용하기 좋은 방법은 미디어쿼리를 이용하는 방법입니다. 우선 아래와 같은 특정요소를 숨기기위한 CSS 코드를 살펴보겠습니다. .notice-go-to-index { display: none; } 위와 같은 기본CSS 코드에 media-query를 사용해 보겠습니다. 아래 코드를 보시면 @media로 시작하고 max-width를 보실 수 있습니다. @media screen and (max-width: 1000px) { .notice-go-to-index { display: none; } } 위 코드는 최대 화면 크기가 1000px 까지는 노출이 된다는 것입니다. ..>

MAC 스타일 코드 블럭 적용 설정 순서 아래 CSS 소스코드 복사, 붙여 넣기. codeblock.js 파일 업로드. HTML 편집에 스크립트 붙여 넣기. 위 순서대로 하시면 간단하게 설정이 가능합니다. CSS코드 pre { position: relative; } pre::after { content: attr(data-ke-language); position: absolute; bottom: 8px; right: 12px; color: #cfd2d1; font-size: 12px; } .hljs { display: flex !important; flex-direction: column; padding: 0 !important; font-size: 14px; border-radius: 8px; box-..>

∴ Toc Toc란? Table of Contents를 의미하고 있으며, markdown으로 작성한 글의 header를 모아서 간편하게 보여주는 용도입니다. 제가 사용한 toc는 tocbot이며, 기본적 스타일도 깔끔하게 되어있지만 저만의 스타일로 살짝 CSS를 수정하였습니다. ∴ 적용하기 아래 첨부 파일을 다운로드하시고 티스토리 스킨 편집에 해당 파일을 업로드해 주세요. ∴ Header 부분 ∴ Body 부분 ∴ Jabascript 부분 ∴ Css 부분 /*toc Start*/ .toc { position: fixed; top: 12%; right: 1.1%; width: 250px; padding: 10px 0px 15px 6px; border-radius: 10px; box-sizing: borde..>

티스토리를 사용하시는 분들에게 좋은 또는 이걸 찾는 분들이 있을 거라 생각하고 소개하는 글입니다. 블로그에 접속을 할 때 내가 지정한 특정한 페이지가 노출이 되게 하고 싶지 않으신가요? 공지나 다른것들은 노출이 되는 방법이 간단하고 찾아보면 금방 가능한데 내가 원하는건 이런 게 아니고 내 블로그에 들어오면 딱 이게 보였으면 좋겠다 하는 거요. 지금 이게 바로 그 방법입니다. 일단 첫째 티스토리 관리자 페이지에서 [HTML/CSS 편집]을 과감히 클릭합니다. 두 번째 skin.html 에서 를 찾아요 (ctrl + F 누르시고 찾기 하셔도 돼요.) 세 번째 위에 아래 소스를 복사 붙여 넣기 합니다. 네 번째 저장을 누르시고 새로고침하고 원하는 대로 잘되었는지 확인합니다. 어때요 참 간단하지요~ 어렵거나 잘..>