웹마스터 팁

XpressEngine 공식 사이트가 1.5로 업데이트 되면서 Button의 모양이 변경되었습니다.
Button이 흰색과 검정색만 남았으며 스타일도 변경되어 이 팁에서 예제를 보긴 힘들듯 싶습니다.

 

./common/css/button.css 이 있어야 합니다.
기본 Core에 포함되어 있습니다.

<span class="버튼"><input type="button" value="버튼 내용"></span>
으로 사용할수 있는데요.[ <span class="버튼"><button type="button">버튼 내용</button></span>으로도 사용 가능. ]

버튼 에 아래와 같은 것들을 넣을수 있습니다.

버튼 흰색 검정색 빨간색 파란색 초록색
작은 크기 button small button black small button red small button blue small button green small
기본 크기 button button black button red button blue button green
큰 크기 button large button black large button red large button blue large button green large

색상 예제
<span class="button black"><input type="button" value="예제 버튼"></span>


<span class="button red"><input type="button" value="예제 버튼"></span>


<span class="button blue"><input type="button" value="예제 버튼"></span>


<span class="button green"><input type="button" value="예제 버튼"></span>


<span class="button"><input type="button" value="예제 버튼"></span>


크기 조절 예제
<span class="button red small"><input type="button" value="예제 버튼"></span>


<span class="button red"><input type="button" value="예제 버튼"></span>


<span class="button red large"><input type="button" value="예제 버튼"></span>


<span class="button red xLarge"><input type="button" value="예제 버튼"></span>


+[TIP]
아래와 같은 방법으로 만들면 링크를 쉽게 걸수 있습니다.
<a href="주소" class="버튼"><span>버튼 내용</span></a>

예제
<a href="http://www.webengine.wo.tc/" class="button blue"><span>??? 사이트 바로가기</span></a>
??? 사이트 바로가기


단. 버튼 눌림 효과가 나타나지 않습니다.