웹디자인 강의
스킨때문에 맨날 들락거리면서 여기 강좌가 있는 줄 몰랐다는..
부끄러워라 좋은 강좌 많이 봤으니 보답하는 의미로다가 제가 만든거 하나 올리고 갈게요
홈꾸미실 때 활용하시라고 메뉴버튼 하나 만들어 봤습니다
우선 적당한 파일 하나 여시구요 원하는 크기로 선택을 해 주세요
![study97-1.gif](/files/attach/images/19360728/825/402/019/study97-1.gif)
그런다음 회색으로 그라데이션을 넣어 줍니다 아래 그림처럼요
![study97-2.gif](/files/attach/images/19360728/825/402/019/study97-2.gif)
자 아래 부분도 이렇게 드래그 해 주세요 위아래 그라데이션의 크기가 같아지도록 짧게 드래그 해 주세요
![study97-3.gif](/files/attach/images/19360728/825/402/019/study97-3.gif)
그리구 그보다 조금 진한 회색으로 전체테두리 1px 넣어 주세요. 자 아래처럼 준비가 되셨나요?
![study97-4.gif](/files/attach/images/19360728/825/402/019/study97-4.gif)
이번에는 잘 보세요 빨간 테두리 안에 확대한 모습을 넣어 보았습니다
올록볼록 땡땡이 공부했던 거 기억 나시죠?(혹시 모르시는 분 제 홈에 오셔서 보시면 되겠습니다)
그거거덩요! 저는 브러쉬 간격을 600으로 주고 그었습니다
![study97-5.gif](/files/attach/images/19360728/825/402/019/study97-5.gif)
여기에서는 브러쉬정의해서 찍으시는 게 아니구요 도트브러쉬로 색을 정해서 콕콕 찍어 주시는 겁니다
브러쉬정의 하셔서 찍으면 한가지 색으로 밖에 안 찍혀요
아래 부분도 똑같이 해 주시구요 alt+ctrl키 동시에 누르면서 이동툴 선택하고 마우스로 끌면 복사되는 거 아시죠?
자 아래처럼 됐나요?
![study97-6.gif](/files/attach/images/19360728/825/402/019/study97-6.gif)
요기에 필요한 글씨 넣어 주시면 메뉴가 되겠죠?
![study97-7.gif](/files/attach/images/19360728/825/402/019/study97-7.gif)
응용작 보여 드릴게요 요건 위에는 흰색 아래에는 조금 더 진한 회색 선 넣어 주시면 조금더 입체적으로 보이거든요
롤오버 하실 때는 반대로 넣어 주시면 됩니다
![study97-8.gif](/files/attach/images/19360728/825/402/019/study97-8.gif)
여기까지예요 이쁘게 응용해서 멋진 홈 만드시는 데 도움이 되었으면 합니다
감사합니다.
더 많은 강좌를 보고 싶으시다면 놀러 오세요
![](http://w1.hompy.com/garden/banner7.gif)
부끄러워라 좋은 강좌 많이 봤으니 보답하는 의미로다가 제가 만든거 하나 올리고 갈게요
홈꾸미실 때 활용하시라고 메뉴버튼 하나 만들어 봤습니다
우선 적당한 파일 하나 여시구요 원하는 크기로 선택을 해 주세요
![study97-1.gif](/files/attach/images/19360728/825/402/019/study97-1.gif)
그런다음 회색으로 그라데이션을 넣어 줍니다 아래 그림처럼요
![study97-2.gif](/files/attach/images/19360728/825/402/019/study97-2.gif)
자 아래 부분도 이렇게 드래그 해 주세요 위아래 그라데이션의 크기가 같아지도록 짧게 드래그 해 주세요
![study97-3.gif](/files/attach/images/19360728/825/402/019/study97-3.gif)
그리구 그보다 조금 진한 회색으로 전체테두리 1px 넣어 주세요. 자 아래처럼 준비가 되셨나요?
![study97-4.gif](/files/attach/images/19360728/825/402/019/study97-4.gif)
이번에는 잘 보세요 빨간 테두리 안에 확대한 모습을 넣어 보았습니다
올록볼록 땡땡이 공부했던 거 기억 나시죠?(혹시 모르시는 분 제 홈에 오셔서 보시면 되겠습니다)
그거거덩요! 저는 브러쉬 간격을 600으로 주고 그었습니다
![study97-5.gif](/files/attach/images/19360728/825/402/019/study97-5.gif)
여기에서는 브러쉬정의해서 찍으시는 게 아니구요 도트브러쉬로 색을 정해서 콕콕 찍어 주시는 겁니다
브러쉬정의 하셔서 찍으면 한가지 색으로 밖에 안 찍혀요
아래 부분도 똑같이 해 주시구요 alt+ctrl키 동시에 누르면서 이동툴 선택하고 마우스로 끌면 복사되는 거 아시죠?
자 아래처럼 됐나요?
![study97-6.gif](/files/attach/images/19360728/825/402/019/study97-6.gif)
요기에 필요한 글씨 넣어 주시면 메뉴가 되겠죠?
![study97-7.gif](/files/attach/images/19360728/825/402/019/study97-7.gif)
응용작 보여 드릴게요 요건 위에는 흰색 아래에는 조금 더 진한 회색 선 넣어 주시면 조금더 입체적으로 보이거든요
롤오버 하실 때는 반대로 넣어 주시면 됩니다
![study97-8.gif](/files/attach/images/19360728/825/402/019/study97-8.gif)
여기까지예요 이쁘게 응용해서 멋진 홈 만드시는 데 도움이 되었으면 합니다
감사합니다.
더 많은 강좌를 보고 싶으시다면 놀러 오세요
![](http://w1.hompy.com/garden/banner7.gif)
댓글 25
번호 | 제목 | 글쓴이 | 날짜 | 조회 수 |
---|---|---|---|---|
공지 | 공지 강좌를 올리기전 공지사항을 읽어주세요 [12] | Eccen | 2004.12.15 | 48031 |
14 |
[하이링고]칵테일 아쿠아
[96]
![]() | 하이링고 | 2003.02.17 | 34383 |
13 |
필름을 클릭하면 사진이 찰칵!
[17]
![]() | 여어자 | 2003.05.29 | 34387 |
12 |
[하이링고]아쿠아 물로 글씨를 쓰자!!
[50]
![]() | 하이링고 | 2003.05.12 | 35271 |
11 |
탄성을 가진 투명 물방울 메뉴
[34]
![]() | 여어자 | 2003.10.07 | 35862 |
10 |
[초보]사진 효과 내기..
[21]
![]() | OnceAgain | 2003.07.23 | 35954 |
9 |
사진의 테두리를 붓으로 칠한듯하게 - 초보자를 위한 강좌
[12]
![]() | 방정환 | 2004.07.24 | 36330 |
» |
메뉴버튼만들기
[25]
![]() | 워니 | 2002.08.24 | 36489 |
7 |
쭘식 플래쉬 메뉴 만들기 (2)
[15]
![]() | 쭘's | 2003.04.24 | 37759 |
6 |
(왕초보도 따라하는) 심플한 버튼 만들기
[53]
![]() | SaRa's | 2004.02.27 | 38084 |
5 |
입체감 있는 메뉴버튼 만들기 (완성된 버튼 다운로드 가능)
[10]
![]() | 이오르 | 2003.09.26 | 38093 |
4 |
포토샵을 이용해서 인물 일러스트 명암을 쉽게 따보자~ ^^
[33]
![]() | caramelkiss | 2004.01.18 | 39858 |
3 | 플래쉬 메뉴 만들기 (위치표시) [24] | {동준짱} | 2002.07.22 | 39872 |
2 |
[일러스트페이지]일러스트로 얼굴그리기~(1) 눈그리기~
[39]
![]() | 현주 | 2002.08.07 | 43569 |
1 |
귀여운 아쿠아 버튼 만들기 (새로운 버젼)
[39]
![]() | 이오르 | 2003.10.10 | 46699 |