2010/09 썸네일형 리스트형 빛이지나가는 플래시 느낌의 문자만들기 1) 적당한 크기의 검정배경의 새파일을 열어주세요. 2) 원하는 글자를 적어주세요. 글자 레이어에서 마우스 우클릭 한 후, Blending Options 을 선택하세요. 3) Gradient Overlay 에서 Gradient 부분을 더블클릭하여, 아래 빨간 표시된 부분을 더블클릭하면 색상코드창이 뜹니다. 거기서 알맞은 색을 골라주세요. (양쪽 다 골라주세요.) 4) 다음, 전경색을 (흰색) 으로 맞춰주세요. 새 레이어를 추가하세요. 그리고 사각도형툴로 글자 시작부분 앞에다가 사각형을 그려주세요. 다음, 사각도형 레이어에서 마우스 우클릭 한 후, Rasterize Layer 을 선택하여, 일반 레이어로 바꿔주세요. 5) 지우개툴 을 선택하여, 사각형 왼쪽 오른쪽 면 부분을 희미하게 조금씩만 지워주세요. .. 더보기 눈 / 비오는 이미지 (700 * 700 사이즈 입니다.) 크로마키로 검정부분을 추출하여 사용하세요. 더보기 영상에 눈내리는 효과 [chroma keyer 크로마키] 베가스 강좌는 정~~~말 오랜만에 하네요 -ㅅ- ;;; 이전에 포토샵에서 만들었던 눈내리는 이미지를 이용하여, 이번에는 영상에 눈이내리는 효과를 주도록 하겠습니다. 포토샵과 베가스는 땔래야 땔수 없는 사이좋은 프로그램이라는건 다들 알고 계실거구요 ^^ 포토샵에서 투명배경으로 작업을 해서 저장할때 PNG로 저장을 하면, 바로 베가스에서 따로 작업할 필요없이 불러들여서 사용할 수 있습니다. 이미지래디로 저장한 GIF 를 베가스에서 사용하려면, 기본 이미지로 작업하는건 꽤 ~~ 나 번거로우므로, 일반 블루,검정, 화이트 이런 단순배경으로작업하셔서 베가스에서 사용하는게 좋습니다. 이렇게 단일 배경이 있을때 , 베가스에서 chroma keyer 크로마키 기능을 이용하여 색을 추출하는 방법이 있습니다. 그럼 지금부.. 더보기 서식을 이용하여 글내용 타이틀 만들기 글 내용을 작성할때 대부분 글 주제 타이틀을 큰 글씨로 작성합니다. 그럴때 매번 색상바꾸고 두껍게 하고 폰트크기 크게 하고...... 이러면 번거롭잖아요? 그럴때 서식을 이용하여 간편하게 바로 꺼내서 사용하시면 됩니다. 제가 사용하는 타이틀은 이 모양 입니다. 아래는 소스입니다. 글을적을때 서식에 체크를 하시고, 제목적으시고 내용에 아래 소스를 고대로 붙혀넣으시고 저장하기를 누르시면 됩니다. 메뉴 미리보기 두께 , 색상은 수정 가능 합니다. 사이트에 맞게 수정해서 사용하세요. 다른모양 타이틀 테이블 희야의웹하우스 // 이곳에 타이틀을 적으세요. 테이블 형식입니다. 하지만 서식으로 저장할꺼니깐 보기좋은게 좋겠지요 ^^ 글쓰기로 들어갑니다. 서식을 선택 하세요. 그리고 제목과 내용이 글을 적습니다. 다 적었.. 더보기 포토샵 한글판 / 영문판 이름 대비 더보기 선글라스에 반사된 배경 요로케 선글라스에 배경이 비치는 효과를 나타내 보겠습니당. 1) 이미지를 불러주세요. 그리고 선글라스에 비춰질 배경 이미지도 같이 불러주세요. 2) 비춰질 배경 이미지를 , 이동툴을 이용해서 선글라스 이미지로 이동시킵니다. (Layer 1) 3) Layer => Layer Mask => Hide All 을 선택합니다. 그럼 원래 선글라스 이미지가 나타납니다. 4) 전경색 (흰색) 배경색 (검정색) 으로 해주시고, 적당한 크기의 브러쉬를 골라 선글라스 부분을 지워주세요. 그럼 선글라스 부분에 배경이미지가 훤히 보입니다. 5) 선글라스에 비치는 배경이미지의 위치를 옮겨보겠습니다. Layer 1 에서 미리보기 이미지부분을 클릭하시고, 연결고리 부분을 꺼주세요. 6) 좀 더 자연스러운 이미지를 나타내기 위해 효.. 더보기 깔끔한 테이블 메뉴 - 3 메뉴 미리보기 마우스 오버시 타원형의 희미한 색상이 보이는 깔끔한 메뉴 입니다. 메뉴 소스보기 희야의웹하우스 ABOUT DIARY BBS LINK → ← 이 테이블도 설명부분이 들어가 있습니다. 수정하는것도 꽤 간편합니다. 잘 사용하세요 @_@ 더보기 깔끔한 테이블 메뉴 - 2 메뉴 미리보기 깔끔한 세로 메뉴 테이블 입니다. 소스 보기 희야의웹하우스 A B O U T D I A R Y B B S L I N K M A I L ■ ■ ■ ■ 테이블과 CSS 로 구성된 깔끔한 테이블 이라서, 수정또한 쉽고 소스도 간결합니다. 기본적으로 테이블 색상과 메뉴이름, 링크 부분을 자신의 사이트에 맞게 수정하시면 됩니다. 빨간색으로 표시된 부분은 메뉴에 마우스를 가따대었을때 테이블 하단에 메뉴에 관한 설명을 적는 곳입니다. 설명하는건 필요없다고 한다면, 하단 빨간색으로 표시된 테이블 부분을 삭제하시면 됩니다. 보라색으로 표시된 부분이 테이블 색상입니다. 전체적인 색상, 마우스 오버시 나타나는 색상입니다. 알맞게 수정해서 사용하세요. 더보기 깔끔한 CSS 메뉴 - 2 ■ 메뉴 미리보기 기본상태 메뉴 모습과 마우스오버시 메뉴 모습입니다. ■ 소스 사용법 = 전체적인 소스를 먼저 다운받으세요. = 위 css 와 js 소스 그리고 아래 4개의 이미지를 모두 다운받아야 합니다. 티스토리를 기준으로 설명하겠습니다. ( 그냥 웹계정에 올린다면, 모든 파일을 같은 폴더에 업로드하면 따로 주소를 적어줄 필요가 없습니다.) 드롭다운 메뉴를 사용해보면서 알게된건데......... css, js 소스를 먼저 업로드하고 이미지주소를 적으면 적용이 바로 안되더군요 -_-) 그래서 일단 이미지들 부터 티스토리에 먼저 업로드 해야합니다. 업로드 하는방법은 앞에 강좌에서 설명했습니다. 티스토리 파일업로드 방법과 주소알아내는 방법 = [■ 블로그꾸미기] - 사이드부분에 새로운 메뉴 추가하기 이곳을.. 더보기 새하얀 눈이 펑펑 내리는 이미지 아직 겨울도 아니고-_- 눈은 더 더 욱 구경하기도 힘들지만 , 올 겨울은 제발제발 눈이 많이 내렸음 하는 바램입니다 ㅠ0ㅠ 어쨋든 요로케 생긴 눈이 내리는 이미지를 만들어볼께요. 1) 이미지를 불러주세요... ( 뭐 이왕이면 눈이랑 관계있는 이미지면 더 좋겠지요 ^^) 2) 전경색은 검정색으로 해주세요, 그리고 새 레이어를 추가합니다. (Layer 1) Layer 1 이 선택되어 있는 상태에서 Alt + Delete 를 클릭하세요. (검정색으로 채워집니다.) 3) 전경색을 흰색으로 맞춰주세요. 툴박스에서 브러쉬 툴을 선택하시고, 적당한 크기의 브러쉬를 고른다음 콕콕 찍어주세요. (한가지 크기의 브러쉬만 찍지마시고, 사이즈를 바꿔가면서 찍어주세요.) 4) Layer 1 의 블렌딩모드를 "Sereen" 으.. 더보기 이미지에 링크 걸기 홈페이지나 블로그 상단 이미지 등등을 만들때 이미지에 링크를 자주 걸게 되는데요. 그런 이미지에 링크거는 방법을 알아보도록 하겠습니다. CS 이전버전에서는 이미지래디 프로그램도 따로있어서, 이미지맵 걸기가 훨씬 더 편했는데, CS 버전은 선택하는부분도 많이 사라졌지만, 그래도 뭐 사용하는데는 큰 불편은 없는거 같애요 @_@ 1) 먼저 링크걸 이미지를 불러주세요. ( 싸랑하는 제 조카 사진입니다....... ^-^ 아무리봐도 넘 귀엽다능 ;;;) (저작권이 심하니깐 가족사진 총출동 하게생겼네요 -_-;;; 근데 해외 유명연예인들 사진은 괜찮다는 말을 들은거같기도 하고 -- ;;;) 2) 툴박스 Slice Tool 을 선택합니다. 그리고 링크걸 부분을 선택을 해주세요. 3) 다음, 선택된 부분에서 마우스 우.. 더보기 접힌모양 둥근 뱃지 만들기 이렇게 한쪽이 접힌 모양의 둥근 뱃지를 만들어 보겠습니다. 1) 적당한 크기의 새파일을 열어주세요 (전, 300 Ｘ 250 흰배경으로 열었습니다.) 2) 새 레이어를 한개 추가해 주세요. (Layer 1) 3) 툴박스 원형툴 모양을 선택해 주시고요, Shift 키를 누르면서 동그란 원을 그려주세요. 4) 전경색에 원하는 색을 골라주시고, 페인트통으로 색을 채워주세요. 선택영역 해제해 주세요. (Ctrl + D) 5) 툴박스 다각형 툴을 선택하여 , 아래부분에 선택을 해주시고, 그 영역안에서 마우스 우클릭하여 Layer via Cut 를 클릭하세요. 그럼 현재 아래 이미지처럼 되있을겁니다. Edit => Transform => Rotate 180 하신후, 페인트통으로 부어주세요. (이때 전경색은 흰색이 되.. 더보기 따끈한 핑크 하트 방금 만든 따끈한 하트 입니다. 투명배경입니다 . 더보기 포토북 만들기 이렇게 생긴 포토북을 만들어 볼께요 1) 먼저 같은 사이즈의 이미지 두장을 준비해 주세요. 2) 자 , 그런다음 두 장의 이미지 가로,세로 를 합해서 조금 더 큰 사이즈의 새 파일을 불러주세요. 또는 더 큰 사이즈의 다른 배경이미지를 불러도 상관없습니다. 3) 그런다음, 툴박스 이동툴을 이용해서 두 장의 이미지를 , 새 배경이미지로 옮겨주세요. 그럼 현재 위 이미지처럼 됩니다. 4) Layer 1 을 선택하고, 새 레이어를 추가해 주세요 . ( Layer 3 가 생깁니다.) 5) Layer 3 가 선택되어 있는 상태에서, 키보드 Ctrl 키를 누른채로 Layer 1의 그림 미리보기창을 클릭하세요. 그럼 Layer 1 의 이미지가 선택이 됩니다. 6) 전경색을 흰색으로 해주세요. 7) 그라디언툴을 선택하고.. 더보기 [ HTML ] img/ 이미지태그의 모든것 이미지 테두리 가장 기본적인 이미지 태그 입니다. 그럼 그냥 요로케 이미지가 나타나게 됩니다. 이미지에 테두리를 줘보겠습니다. 그럼 이미지에 1 만큼의 두께의 테두리가 생겼습니다. 당연히 border="숫자"의 크기가 높을수록 테두리 두께가 두꺼워 지겠지요. 이미지 링크 이미지에 그냥 링크를 걸면 , 이미지 주위로 파란색 테두리가 생기게 됩니다. 이럴때는 뒤에 border="0" 을 적어주면 파란색 테두리가 사라지게 됩니다. 이미지옆의 글자 위치 그림의 위쪽과 텍스트의 위쪽을 나란히 하여 한 줄의 텍스트만 들어갑니다. 그림의 중간부분을 기준으로 한 줄의 텍스트만 들어갑니다. 그림의 아래쪽을 맞추어 한 줄의 텍스트만 들어갑니다. 이미지옆에 글을 적어보자 이곳에다가 글을 막 써주세요 ^^ = 그림은 왼쪽, .. 더보기 이전 1 2 3 4 5 6 다음
