티스토리 블로그 카테고리 디자인 바꾸기

Posted by애드센스
2014. 9. 29. 17:28 블로그(About Blog)/블로그(Blog)

티스토리 블로그 카테고리 디자인 바꾸기

 

 

 

티스토리 블로그는 자체적으로 많은스킨을 제공하고 있지요.

하지만 개인마다 취향이 다른만큼 자체적으로 제공하는 블로그 디자인을

내 취향데로 바꾸고 싶을때가 많죠..?

 

저 또한 카테고리 디자인이 마음에 들지않아,

나름 노력한 끝에 드디어 성공하게 되었어요~!

의외로 간단하면서도 css에 대한 지식이 없으면 할 수 없는 부분인것 같아서

다시한번 공부를 해야 겠다는 다짐을 해 봅니다...

 

 

 

 

그럼 카테고리 디자인 수정하러 고고싱~!

 

※항상 스킨수정을 하기 전에 백업은 생활화 합시당!

 

 

포스팅내용

1. 카테고리 디자인 바꾸기

2. 링크 밑줄 없애기

 

 

 

 

 

제 블로그의 기본 카테고리 디자인이에요.

아무리 블로그 디자인에 대해서 신경을 안쓴다고 해도.... 이건쫌

no2

 

 

 

 

개인적으로 어둑어둑 한 것을 별로 좋아하지 않는답니다.

 

 

 

1.카테고리 디자인 바꾸기

관리모드로 들어와서 HTML/CSS편집을 클릭 해 주세요.

그럼다음 'Ctrl+F' 를 눌러 찾기를 실행 후

'article table the {backround-color'

입력을 하시고, style.css 부분에서 위 글을 찾아주세요.

 

 

 

기본적으로 색상으로 되어있구요.

아래 코드를 보시고 색상부분에 #을 지우고 입력을 해 주세요.

{backgound-color : transparent;}

 

배경색을 블로그 디자인 색상에 따라 투명으로 지정하는 명령어 입니다. 

미리보기를 눌러보세요.

 

 

 

 

 

 

 

 

 

짜잔~!! 어둑어둑한 회색이 사라졌습니다.

최소한.. 블로그 디자인은 이정도는 되어야 한다고 봐요!

그런데 밑줄이 눈에 거슬리는군요...>.<

이것도 수정을 해 줘야 겠어요..!

 

 

 

 

 

 

소스를 위 아래 두 군데를 바꿨는데,

이 부분이 어느 부분인지는 알고 넘어가야 할 거 같아서,

위치확인을 위해 테스트를 해 보았어요.

 

 

 

윗부분은 좌측 박스고, 아랫부분은 우측 날짜 박스였군요..ㅎㅎ

 

 

 

자...! 그럼 거추장 스러운 밑줄을 없애 볼까요~!

style.css의 가장아랫부분의 빈 공간으로 가서 아래 코드를 입력해 주세요.

 

 

/*카테고리 밑줄없애기*/
.another_category a.current {text-decoration : none !important;}
.another_category a {text-decoration: none !important;}

 

티스토리_카테고리디자인수정.txt

 

 

 

 

위 코드를 입력하고, 미리보기를 눌러주세요.

오호호~ 드디어 밑줄도 사라졌군요.

이상이 없는걸 확인하고 저장을 눌러주세요~!

 

 

이 글을 끝까지 읽어주셔서 감사합니다.

수고하셨습니다.