본문 바로가기

블로그 관련 정보/블로그 꾸미기

FastBoot 반응형 스킨 배경 이미지 지정하기

FastBoot 반응형 스킨 배경 이미지 지정하기
광고 차단 플러그인을 꺼 주시면 블로그 운영에 도움이 됩니다. ^^

FastBoot 반응형 스킨을 만지작 거리면서 한가지 한가지 배워나가면서 글 작성을 하네요.

 

FastBoot 반응형 스킨을 받아서 설치해 보면 메인 화면에 배경 컬러가 지정되 있습니다. 특별히 이미지를 사용안하시고 배경색 변경을 해서 사용하고자 하신다면 간단하게 컬러만 수정해 주시면 됩니다.

 

이 글에서 배경색 지정, 배경 이미지 사용을 함께 알아보겠습니다.

 

FastBoot 반응형 스킨 배경 색상 변경하기

 

작업전 사용중인 스킨을 백업해 주세요. 티스토리 스킨 수정전 백업은 필수!!!!!

 

 티스토리 관리화면을 접속하셔서 HTML/CSS 편집을 선택 하세요. 그리고 CTRL + F를 눌러 찾기 창을 열어서 ' body { '을 입력하세요.

 

style.css란에 나오네요. 이미지를 보시면 컬러지정을 RGB로 지정된것을 보실수 있습니다.  스킨 제작자님께서 어떠한 의도든 최적화를 위해 RGB로 지정하셨을수 있지만 우리가 컬러값을 입력할때 RGB로 입력하기는 힘들수도 있습니다.

 

일반적으로 사용하는 #컬러값을 입력하시면 됩니다. #컬러값은 rgb(241, 242, 246) 을 지우고 #컬러값으로 변경하시면 됩니다.

 

위 이미지처럼 변경하시고 저장 후 FastBoot 반응형 스킨 메인으로 가셔서 새로고침해보시면 변경된 배경을 보실수 있습니다.

 

FastBoot 반응형 스킨 배경 이미지 지정하기

 

위에서 배경색을 지정해 봤습니다. 이젠 메인화면에 배경이미지를 넣는 방법을 알아 보겠습니다.

 

배경색을 담당하는 ' background-color:rgb(241, 242, 246); '소스를 아래 소스로 변경해 주세요.

 

  background: #647E98 url(./images/이미지이름.png); - 확장자는 jpg, gif도 됩니다.

 

전 위 이미지처럼 넣었습니다.

 

여기에서 소스 설명을 잠깐 드리자면 background뒤로 컬러 지정을 했습니다.컬러를 지정한 이유는 로딩시 이미지를 불러오는 시간동안 지정한 배경색을 보여 줍니다.

 

그리고 저처럼 PNG파일을 사용해서 투명도 조절을 한 이미지라면 배경색을 사용할수도 있습니다.

 

소스 추가를 하셨다면 '저장'을 눌러 주시고 준비한 배경이미지를 블로그에 올려주시면 됩니다.

 

배경이미지 올리기는 HTML/CSS -> 파일 업로드에 올려주시면 됩니다.

Comments