오늘은 오디세이 스킨에서 글 목록에 표시되는 썸네일 위치를 바꿔보겠습니다 이런 식으로 썸네일 위치가 오른쪽에서 왼쪽으로 변경하였습니다 티스토리 스킨 편집 - CSS 수정 [블로그 관리 홈] > 꾸미기-스킨 편집 > html 편집 - CSS 항목을 클릭하여 ctrl+f를 눌러 .article-type-thumbnail를 검색해 주세요 flex-direction: row-reverse;로 되어있을 텐데 row로 고쳐주시면 됩니다 그러면 썸네일 위치가 왼쪽으로 변경이 되는데, 썸네일과 글 사이의 간격이 좁게 나오게 됩니다 이를 해결하기 위해서 margin-left 값은 주석 처리를 하고 밑에 margin-right: 30px이라는 간격을 추가해 줍니다 border-radius는 사진 테두리를 둥글게 만드는 역..

오디세이 스킨에서 글을 작성하면 제목 영역에 배경 이미지가 생기면서 많은 영역을 차지하게 됩니다 디자인 부분에서 마음에 들지 않아 이 부분을 제거해 봤습니다 해당 사진을 이번 시간에 적용해 봅시다 티스토리 스킨 편집 - CSS 수정 .article-header:before { display: none; } .article-header { background-image: none !important; } .article-header .inner-header { color: #333; } #tt-body-page .main { padding-top: 88px; } @media screen and (max-width: 1060px) { #tt-body-page .main { padding-top: 48px; ..

안녕하세요 오늘은 티스토리에서 지원하는 오디세이 스킨 왼쪽 사이드 메뉴를 오른쪽으로 옮겨보도록 하겠습니다 아무래도 한국 사람들은 대부분 왼쪽부터 글을 쓰고 읽기 때문에 이런 점을 고려해서 메뉴 위치를 변경했습니다 우리가 오늘 적용할 왼쪽 사이드 메뉴입니다 티스토리 스킨 편집 - CSS 수정한다 [블로그 관리 홈] > 꾸미기-스킨 편집 > html 편집 - CSS 항목을 클릭해서 ctrl+f 키를 눌러 .wrap-right .main이나 .wrap-right .area-aside 태그를 검색합니다 검색 후 사진과 같이 flex-direction 값과 margin 값을 설정해 주세요 여기까지 적용했으면 메뉴바 위치가 왼쪽으로 이동될 겁니다 메뉴바가 옮겨졌으면 본문 내용 크기와 메뉴 폭이 알맞지 않을 텐데 이..

오늘은 티스토리에서 지원하는 인용구 blockquote를 수정하여 인용구에 폰트와 디자인을 입맛대로 설정해 봅시다 해당 인용구를 사용했을 때 폰트와 디자인을 변경할 겁니다 1. 인용구에 적용할 색상을 선택하자 구글에 '색상 선택 도구'를 검색하여 인용구에 적용할 색깔을 선택해 주세요 HEX 값을 복사하여 티스토리 css 편집에서 사용할 겁니다 2. 인용구에 적용할 폰트를 선택하자 눈누 상업용 무료한글폰트 사이트 noonnu.cc 적용할 폰트를 눈누 사이트를 통해서 선택하시면 됩니다 상업적 무료로 사용할 수 있습니다 전 '넥슨 배찌체' 를 선택했습니다 여기서 오른쪽 부분에 [웹폰트로 사용] 항목을 복사해 주세요 3. 티스토리 인용구(blockquote) 수정하기 [블로그 관리 홈] > 꾸미기-스킨 편집 >..

블로그를 꾸미는 도중 마우스 커서와 애니메이션 적용 방법을 알게 되었습니다 티스토리에서 html과 css을 능숙하게 다룬다면 웹 페이지를 좀 더 예쁘게 꾸밀 수 있습니다 오늘은 티스토리에 마우스 커서와 애니메이션을 설정해 보겠습니다 1️⃣ 마우스 커서 디자인 선택하기 Free Cursor Downloads - Cursors-4U.com Date: 4 Feb 2021, 21:35 By Tor With 7 Comments This month's favorite cursors is the "Sexy Red Lips". It's unknown who made the image. If you know who did it, send me an email so I can give proper credit. Also ..