😢 커버 커스텀 도전기 : 갤러리 CSS 구조 분석!갤러리 커버 HTML을 분석해 봤으니 이제는 스타일을 살펴볼 차례!HTML이 뼈대라면 CSS는 그 위에 입히는 옷 같은 존재다.어떤 색을 쓸지, 여백은 얼마나 둘지, 크기나 정렬은 어떻게 할지 등을 결정하는 게 CSS다.그럼 포트폴리오의 갤러리 커버에는 어떤 스타일이 적용되어 있을까?직접 CSS를 하나씩 뜯어보면서 어디를 수정하면 원하는 디자인을 만들 수 있을지 살펴보자!   💡 추가 정보 :  [Info🔍/HTML&CSS] - [Portfolio 스킨] 27. 홈 화면의 안 쓰는 커버 커스텀: 갤러리 HTML 구조 분석부터 시작!  🔧 포트폴리오 스킨 갤러리 CSS 구조를 하나씩 살펴보자! ✔ 티스토리 스킨의 CSS를 확인하기 위해선 꾸미기 →..

📌 커버 커스텀 도전기 : 갤러리 HTML 구조 분석!홈 화면에 안 쓰는 커버를 커스텀해서 활용하고 싶어졌다.내가 포트폴리오 스킨을 사용하는 가장 큰 이유가 슬라이더 커버 때문이다.반면 와이드 패널은 내 블로그 스타일과 맞지 않아서 전혀 쓸 일이 없어 보인다.  와이드 패널은 배너처럼 가로로 길쭉한 형태로 사진이나 작업물을 자주 올리는 블로그에는 잘 어울릴 듯하다.하지만 내 블로그에서는 활용도가 떨어진다.갤러리 커버는 모바일 화면에서 작게 보여서 손이 잘 안 간다.결국 현재 섬네일 리스트와 리스트형 커버만 사용 중인데 너무 단조로워 보여서 다른 커버를 커스텀해보려고 한다. 문제는...코딩을 배운 적이 없다는 것! 😥어디서부터 손을 대야 할지 감이 안 와서 일단 갤러리 HTML 구조부터 분석해 보기로 ..

😢 강조하는 부분을 이쁘고 편하게 바꾸고 싶다 포스팅을 하다 보니까 강조하는 부분을 표시하는 방식이 여러 가지가 있더라.글자 크기, 글자 색, 하이라이트, 밑줄, 굵게, 기울기 등그렇지만 매번 글자 크기를 바꾸거나 글자 색을 주거나 하이라이트를 칠하는 건 귀찮다.어떤 색을 써야 눈에 잘 띄면서 디자인도 좋은지 생각해야 하고..미적 감각이 없는 나는 그냥 굵게, 밑줄, 기울기를 사용하는게 편하다.공책에 밑줄도 항상 색이 있는 펜이나 형광펜을 써왔기 때문에 까만 줄이 거슬린다.이쁘지도 않고ㅠㅠ그렇다고 매번 하이라이트 효과를 주자니 귀찮아, 색도 너무 많고.그래서 css를 이용해서 밑줄를 꾸며보기로 했다. ✨ 밑줄 효과 꾸미기: 원하는 목표 2가지첫 번째, 그라데이션두 번째, 색상  🔧 포트폴리오 스킨 수..

🤔 페이지 위로 가기 / 아래로 가기 버튼, 뭔가 부족해 저번에 만든 페이지 이동 버튼을 클릭하면 위아래로 순간 이동하는 건 편리했다.그런데 양끝단으로 이동이 필요하지 않을 때는 또 어쩔 수 없이 무한 스크롤 지옥이더라.스크롤 버튼을 누르지 않을 땐 위아래로 조금씩 움직이는 기능을 넣으면 어떨까 하는 생각이 들었다. 💡 추가 정보 : 자동 스크롤은 필요없고 버튼 클릭 시 위/아래 이동 기능만 필요한 경우 아래 링크에서 확인하면 된다. [Info🔍/HTML&CSS] - [Portfolio 스킨] 05. 티스토리 스킨에 스크롤 이동 버튼 구현 방법: 위로 가기, 아래로 가기 ✨ 페이지 이동 버튼에 기능 추가하기: 구현 목표 3가지첫 번째, 버튼을 클릭하면 → 위 또는 아래로 이동두 번째, 마우스를 버튼..

🤔 내용의 흐름을 파악하기 쉽게 자동 목차를 만들자.원래는 목차를 사용하지 않다가 이 블로그를 가장 많이 사용하는 내가 너무 불편한 거다.디자인은 둉이님이 올려주신 코드를 기반으로 내가 필요한 부분을 수정해서 만들었다.기본적인 설명도 둉이님 블로그에 자세히 올라와 있다. ✨ 자동 목차 커스텀 목표 3가지첫 번째, 본문 목차의 디폴트는 펼쳐진 상태이고 접으면 목차 내용 영역이 완전히 숨겨질 것.두 번째, 현재 본문에 보이는 소제목이 오른쪽 목차에 표시되고 목차가 길면 목록 가운데를 유지할 것.세 번째, 오른쪽 본문 목차 버튼은 오른쪽 목차와 별도로 생성해서 위치를 고정해 둘 것. 💡 자동 목차가 있으면 좋은 점✔ 한눈에 보기 편하다. 긴 글을 읽을 때 어디에 무슨 내용이 있는지 쉽게 파악할 수 있다.✔..

😢 단조롭고 못생긴 티스토리 태그 클라우드, 어떻게 이쁘게 만들지?태그가 박스에 쌓여있으니 뭔가 답답해보이고 심심하다.기존에 수정할 땐 그래도 이뻐보였던 것 같은데 질린건가ㅠㅠ색도 바꿔보고 크기도 바꿔보고 이것저것 시도해 봤는데 마음에 안 든다.무엇보다 태그 목록만 왼쪽 정렬인 게 진짜 진짜 별로다!!!  ✨ 태그 클라우드 스타일 개선하기: 해결해야 할 3가지 문제첫 번째, 태그 사용 빈도별 크기 & 색상 지정하기두 번째, 태그 목록 가운데 정렬하기세 번째, 태그 랜덤 정렬하기 💡 추가 정보 : 테두리 모양이나 빈도별 태그 컬러를 수정하고 싶다면, 아래 링크에서 방법을 확인할 수 있다.🔗 [Info🔍/HTML&CSS] - [Portfolio 스킨] 10. 태그 클라우드 꾸미기  🔧 포트폴리오 스..