저번 포스팅에서는 줄바뀜 시 단어가 잘리지 않고 통째로 넘어가는 방법에 대해 다뤄봤습니다. https://jaeheepapa.tistory.com/entry/CSS-티스토리에서-줄바뀜-시-단어가-잘리지-않게-하기 [CSS] 티스토리에서 줄바뀜 시 단어가 잘리지 않게 하기 별 생각없이 블로그를 살펴보다가 눈에 거슬리는 점을 발견했습니다. 보이시나요? 최근 제목이 긴 글을 포스트했는데 이렇게 메인화면에서 단어가 잘리는 것을요. 제주메밀식 당 해결방 법 과 jaeheepapa.tistory.com 그런데 또 사용하다보니 아무래도 오른쪽 공백이 신경쓰이더군요. 그래서 이번에는 제목을 한줄로 표시하고 넘치는 부분을 생략 표시(...)로 표현되게 바꿔보겠습니다. white-space: nowrap; overflow..

별 생각없이 블로그를 살펴보다가 눈에 거슬리는 점을 발견했습니다. 보이시나요? 최근 제목이 긴 글을 포스트했는데 이렇게 메인화면에서 단어가 잘리는 것을요. 제주메밀식 당 해결방 법 과 같이요. 성격상 한줄에 다 들어가는 것이 제일 좋지만.. 당장 제목을 바꿀 수 없을 것 같아 미봉책으로 다른 방법을 생각해봤습니다. 적어도 줄이 바뀌면서 단어가 잘리지는 않게 해보려고요. 먼저 관련한 css 문법을 확인해보겠습니다. /* Keyword values */ word-break: normal; word-break: break-all; word-break: keep-all; 출처 : https://developer.mozilla.org/en-US/docs/Web/CSS/word-break 속성을 살펴보면 norma..

웹서핑을 하다보면 필요한 부분을 복사하기 위해서이기도 하지만 저는 의미없는 마우스 드래그를 하며 글을 읽는 편입니다. 드래그를 하면 보통 다음과 같은 모습이 나옵니다. 마우스로 드래그한 부분이 대부분 위와 같은 하늘 색으로 표시가 되는데 또 어떤 홈페이지는 다른 색으로 나옵니다. 사실 드래그 색상이 홈페이지에서 중요한 요소는 아니지만 제 경우에는 이런 간단한 변화로 괜히 더 호감이 더 가고 공을 들였다는 생각이 들게 됩니다. 그리하여 지금 운영하는 블로그도 한번 색을 바꿔봐야겠다는 생각에 한번 작업을 해봅니다. 티스토리 관리자 모드에서 스킨 편집을 클릭, html 편집을 누릅니다. 그 후 HTML 옆에 CSS를 클릭합니다. CSS코드가 쭉 나오는데, 아무 위치나 상관없습니다. 다음 코드를 입력해봅니다. ..

위와 같은 그리드 형태의 티스토리 스킨을 쓰다보면 깔끔하고 좋지만 약간의 디자인이 들어가면 좋겠다는 생각이 듭니다. 개인 취향이지만 저는 이미지의 테두리가 둥글둥글한 것이 더 마음이 가는데요. 사용하는 스킨에서 옵션이 있는 경우도 있지만 없는 경우에는 직접 편집을 해주어야 합니다. html은 들어봤는데 css는 뭐지..? 하는 분부터 들어는 봤는데 직접 하기엔 좀.. 이런 분들도 할 수 있는 간단한 매뉴얼을 준비해보았습니다. 스킨마다 조금씩 차이가 있을 수 있는데요, 저는 정상우님이 제작하신 hELLO스킨을 사용 중입니다. 몇가지 스킨을 사용해보았는데 가장 최적화가 잘 되어있고 잘 짜여있어 조금씩 수정해서 사용하기도 좋은 스킨이라고 생각합니다. https://pronist.tistory.com/5 hEL..