[해피CGI][cgimall] 버튼디자인을 간편하게 줄 수 있는 bttn.css

 

bttn.css는 버튼에 스타일을 간편하게 적용할 수 잇는 css입니다.
스타일 시트에 포함된 각 클래스명을 해당태그에 부여하여 쉽게 디자인을 적용 할 수 있습니다.

홈페이지 또는 파일을 다운받으시고 압축을 푸시면
dist폴더에서 bttn.css 또는 bttn.min.css 파일을 사용할 html 파일에 연결하시고
아래와 같이 클래스명을 적용하시고 사용하시면 됩니다.

 

클래스명 또는 css 소스는 bttn사이트에서 쉽게 찾고 예제를 확인하실 수 있습니다.

 

 

현재 총 13개의 버튼스타일을 제공하고 있으며

 

 

상단부분에서 컬러, 크기, block, outline을 설정하시고 확인하실 수 있습니다

 

 

적용 할 버튼을 하나 선택하시면

1번 부분에서 사용된 css코드를 확인하실 수 있고

2번 부분을 클릭하시면 적용할 html 소스예제가 복사 됩니다.
ex) <button class="bttn-slant bttn-md bttn-primary">medium</button>
복사된 코드에서 적용할 클래스명을 확인하실 수 있습니다.

사이트에 있는 스타일 외에도 css를 조정하여 다양한 스타일로 변경하여 자신만의 스타일을 입힐수도 있습니다.