본문 바로가기
★정보/티스토리 스터디

티스토리 꾸미기~ 상단 백 그라운드 이미지 변경하기! 드림위버이용!

by 오카네모치777 2014. 10. 8.
반응형

요번에~ 티스토리에서 제공하는 스킨 말고~

무료로 배포되는 스킨으로 변경했어요~^^

그랬더니 상단 이미지가 썰렁 하더라구염~



주황색으로 동그라미 친 ! 이 부분!!

이부분에 뭔가를 하고 싶었어욤!! 그래서~


이렇게 바꾸었죠!!

아하하하하~~ 신랑과 저의 모습이예염^^ㅋ 엽기 부부죠!! 이런거 좋아해염 ㅋ

역시나 개인정보 보호를 위해 일러스트 선그라스를 합성했어염 우캬캬캬


이거 만드는거 알려드릴께염!!

그런데 안타깝게도.. 전 프로그래머가 아니라서...드림위버라고 하는

간단히 코딩하는 프로그램을 쓰거든요.

이걸로 하는데.. 이 프로그램을 못쓰시는 분들은... 도움이 안될 수 도있어염


우선요.

이미지를 만드세염!

PNG파일로 저장하셔야해염


전 이렇게 만들었어염!

이 이미지를 우선 인터넷상에 올려야 하는데, 다른 서버를 갖고 있지 않으니~

전 그냥, 티스토리에 제가 포스팅 해 놓은 곳의 하단에 이미지를 붙여버렸어여^^ㅋㅋ

그러면 이미지가 웹상의 주소를 갖게 되지욤!!


그 상태에서요.

HTML / CSS편집의 소스를 전부 복사해욤


그래서 드림위버를 켜고 소스를 붙이지욤!

그럼 소스가, 이미지 화 되어서 왼쪽에는 소스, 오른쪽에는 이미지화로 보이지욤~!


여기에 오카네모치777 이부분의 하단에 이미지를 넣을꺼예염

우선 이 부분이 어디의 소스인지 알기 위해서, 오른쪽의 원하는 부분을 드레그 하면

왼쪽에 해당사항의 소스가 같이 드레그가 되지염!!

그 소스 위에 하단의 소스를 넣을 꺼예염


<div align="left" style="width:929;height:155px;background-image:URL('https://t1.daumcdn.net/cfile/tistory/2448E63B5434D2620B')">


이렇게욤!!

새로가, 929px였고  가로가 155px이었기에 숫자를 넣었고,

타이틀이 왼쪽에 가게 하기 위해서

정렬은 left를 넣고, 방금전에 이미지를 등록한 주소를

URL이라고 한 뒷편에 넣었어염


이렇게 넣고 나면 드림위버에 이렇게 나오죠!


이미지가 들어갔죠?


이 상황에서 왼쪽에 있는 소소를 전부 긁어다가,

아까전에 HTML/CSS편집이라는 코너에 다 붙여놓고

저장하기를 누르세염


그럼 이렇게 나옵니다!



우헤헤헤헤!! 바뀌었습니당^^


기쁩니당!!ㅋ 하나씩 하나씩 제것이 되어 가는 기분이네염^^


여러분도 이번건 조금 어렵지만..ㅠㅠ 꼬~옥 해보시기 바래욤!!

반응형