[한시적 무료] CSS3 ButtonBuilder - CSS 스타일 속성만을 이용해 버튼 만드는 도구

이번 포스트는 한시적 무료로 다운로드 받을 수 있는 CSS3 ButtonBuilder OS X 용 앱에 대한 내용입니다.

CSS3 ButtonBuilder

CSS3 버튼빌더(ButtonBuilder)는 시각적으로 정교한 크로스 브라우저 CSS3 의 이미지를 사용하지 않는 버튼을 설계 할 수 있습니다.

단순히 각 속성에 대한 슬라이더를 조정하여 디자인에 대한 모든 권한을 가지고 있고 CSS3 스타일 시트에서 사용하는 CSS3 코드를 준비할 수 있습니다.

CSS3 버튼빌더는 재사용에 대한 모든 설정을 저장과 로드를 할 수 있습니다.

버튼의 넓이, 높이, 보더 등에 대한 속성도 지정할 수 있고 폰트 종류, 스타일, 사이즈에 대해서도 설정이 가능합니다.

각각의 옵션들을 설정과 해제도 가능하고 많은 옵션들을 적절히 사용하면 위와 같이 버튼을 미리보기 형태로 확인할 수 있고 하단 Generate CSS/HTML 버튼을 통해 HTML output 이 가능합니다.

다음과 같이 CSS 와 HTML 코드를 확인할 수 있습니다.

결과적으로 아래 코드를 적용한 모습입니다.

MobileRumors

위 링크는 이미지가 아니며 실제 클릭시 동작되는 HTML 코드 입니다.

웹페이지내 스타일이 적용되어 있다면 output 된 결과물 만으로 해결되진 않을 수 있습니다.

상황에 따라 important 속성을 통해 원하는 값을 강제 지정할 수 있도록 하면 결과물과 완벽하게끔 적용이 가능합니다.

제작에 대한 큰 도움은 가능하나 기본적인 CSS 속성의 지식을 가지고 있다면 좀더 쉽고 빠르고 다양하게 생산성의 향상을 가져올 수 있을거라 생각됩니다.

CSS3 버튼빌더의 정보는 다음과 같습니다.

• 버전 : 1.1
• 크기 : 2.4MB
• 다운로드 : 링크

관련글

• CSS를 이용해 앱스토어와 비슷한 버튼(링크) 만들기

페이스북(@mobile), 트위터(@mobile_issue) 계정을 팔로우
하시면 실시간으로 정보를 제공 받을 수 있습니다.

로그인이 필요 없는 추천(하트) 으로도 블로그 주인에게 힘이 됩니다.
많은 응원과 격려 부탁 드려요.