링크 버튼 무료제작 사이트 [CSS Button generator]
블로그 포스팅 내용 중 링크를 넣으실 때 버튼을 삽입하시는 경우가 있습니다. 이 버튼의 다양한 디자인을 무료로 제공해주는 사이트가 있어서 정리해봤습니다.
목차
[CSS Button generator] 사용 방법
(1) 버튼 디자인 고르기
화면 좌측의 버튼 프리셋 리스트 중 맘에 드는 것을 골라줍니다.
(2) 버튼 디자인 수정하기
화면 우측의 조절기를 통해 버튼 디자인을 수정합니다. 그리고 상단에 text에 버튼에 입력할 글을 작성해줍니다.
(3) 버튼 코드 등록
- 버튼 코드의 맨 윗줄은 서식에 Html 모드로 등록해줍니다.
- 그 다음줄부터 마지막까지의 코드는 티스토리 스킨편집에서 'CSS'탭에 들어가 입력하고 저장해줍니다.
(4) 버튼 포스팅에 사용하기
- 서식에서 버튼 서식을 불러옵니다.
- 버튼 이름과 링크를 html모드에서 입력합니다.
(5) 버튼 디자인 확인하기
- 포스팅 작성 중엔 버튼 디자인이 안보이고 텍스트만 보이지만, 포스팅 작성 완료를 누르고 글을 보면 디자인된 버튼이 적 용된 링크 버튼을 확인하실 수 있습니다.
- 버튼 디자인에서는 글씨 색상을 흰색으로 했었는데요. 포스팅 화면에서는 블로그 스킨편집의 추가설정에서 지정한 포인트 컬러로 변경되어 나타납니다. 글쎄가 잘 보일 수 있게 색을 지정해주거나, 버튼 디자인의 배경색을 조절해주면 됩니다.
[CSS Button generator] 사이트 링크
A useful tool for designing css buttons
Button generator is a free online tool that allows you to create cross browser css button styles.
www.bestcssbuttongenerator.com
마무리
이번 포스팅에서는 링크 버튼을 디자인할 수 있는 사이트에 대해 정리해봤는데요. 블로그 운영하면서 필요한 사이트나 자료들을 하나씩 정리해보고 공유하도록 하겠습니다. 조금이나마 도움이 되셨길 바랍니다. 감사합니다.
끝까지 읽어주셔서 감사합니다.
공감과 구독, 그리고 댓글은
저의 블로그 활동에
큰 원동력이 됩니다.
오늘도 좋은 하루 보내세요♥
![](https://t1.daumcdn.net/keditor/emoticon/friends1/large/003.gif)
항공기 위치 추적 및 공항 정보 사이트 [Flight rader 24]
Flight rader 24 소개 Flight rader 24는 항공기 추적 서비스로, 실시간으로 항공기의 위치, 비행 경로, 고도, 속도 등 다양한 정보를 제공하는 사이트입니다. 운행중인 항공기의 위치와 출발지, 도착지,
sugarlessgum.tistory.com
바람, 강수량, 위성사진 및 태풍 추적 사이트 [windy.com]
Windy.com 소개 윈디(Windy.com)는 날씨 예보 및 시각화 서비스를 제공하는 인기 있는 사이트입니다. 이 플랫폼은 전세계를 대상으로 실시간 날씨 정보, 현재 상황, 예보 및 다양한 날씨 관련 데이터를
sugarlessgum.tistory.com