​​ FastBoot 스킨 최상단 블로그이름 색깔 바꾸기

FastBoot 스킨 최상단 블로그이름 색깔 바꾸기

제 블로그 상단을 대충 손보았는데 아무래도 블로그 제목부분이 뭔가 허전하고 부조화스럽습니다.

 

 

 

이번 포스팅에서는 검정색인 블로그 이름을 상단바의 색과 동일하게 맞춰보도록 하겠습니다.

먼저 티스토리 관리자 화면의 스킨편집을 누른뒤 HTML편집창이 열리게 한뒤 CSS 탭으로 갑니다.

이과정은 우리가 FastBoot 스킨 상단부분을 수정하면서 항상 해왔던 과정이라 어렵지 않을 것입니다.

예상하시는 대로 다음 과정은 열린 CSS창에서 Ctrl + F를 눌러 검색창을 엽니다.

검색창에 #desktopNav 라고 칩니다.

 

 

 

블로그 제목색상을 바꾸기전에 주위의 글씨색들도 어차피 바꾸어야 하니 우측의 아이콘있는 메뉴들 먼저 바꾸어 보겠습니다.

 

 

 

첫번째 네모는블로그  제목이 들어가는 부분의 바탕색 설정이고, 두번째 네모는 블로그제목 우측편에 있는 회색 메뉴들의 색상입니다.

그리고 좀더 내려가면 hover라고 써진 색상이 있는데 그부분은 마우스가 방명록등의 우측메뉴에 올라가면 색상이 변하는 이벤트의 변할 색상입니다.

저의 경우는 바탕색은 놔두고 우측메뉴색상을 평상시 초록, 마우스오버시 빨강으로 교체했습니다.

 

자 이제 두개 남았습니다. 좌측의 큰글씨 블로그 제목과 그 제목아래에 있는 블로그 소개 문구입니다.

먼저 #desktopNav h3 { line-height:1; } 이런 글이 있는 줄로 찿아갑니다.

그다음 line 앞에 color : 원하는 색상코드; 이렇게 써 넣으십시요.

저는 상단 고정바의 진한초록색상 코드인 #005500을 넣었습니다.

 

 

 

자이제 확인해 보시면 블로그의 제목은 색상이 바뀌어 있습니다.

이제 마지막으로 제목아래의 조그만 글씨 블로그 소개 문구 색상을 바꿀차례입니다. 

아마도 소개문구를 설정하지 않으셨던 분들은 더이상의 작업은 필요없겠죠.

 

자 이제 #desktopNav p { margin:0; 라고 쓰여진 부분으로 찿아갑니다.

지금 우리가 작업했던줄의 약간 위에 있습니다.

찿아가셨으면 margin 앞에 위에서 했던 작업처럼 color : 원하는 색상코드; 이렇게 삽입합니다.

저는 우측 메뉴들의 색상과 동일하게 연초록의 색상코드 #50AF49 를 넣었습니다.

 

 

 

이제 저장하고 확인하시면 상단 고정바 위의 최상단 블로그제목 구역이 모두 색상이 바뀐것을 확인하실수 있습니다.

 

 

수고하셨습니다.

최상단 블로그 제목부분의 구역을 모두 색상정리하셨습니다.

댓글

Designed by JB FACTORY