본문 바로가기
----- IT -----/jQuery Moblie

jQuery Mobile - Inline Buttons

by 대소니 2011. 5. 18.
디폴트 버튼의 가로 길이는 스크린을 꽉 채운 형태입니다.
만약, 작은 버튼을 만들고자 한다면, 버튼 속성으로 data-inline=”true” 를 추가해 주면 됩니다.

<a href="index.html" data-role="button" data-inline="true">Button</a>

만약, 같은 라인에 여러 버튼을 나열하고 싶은때는 버튼 태그를 data-inline=”true” 속성을 추가한 상위 div 태그로 감싸줍니다.

<div data-inline="true">
    <a href="index.html" data-role="button">Cancel </a>
    <a href="index.html" data-role="button" data-theme="b">Save </a>
</div>

하지만 실제로 해보니 아직은 적용이 안되네요. 버젼이 올라가면 가능해질 것 같습니다.
불편하지만 현재까지는 각 태그별로 속성을 추가하여야 합니다.

<a href="index.html" data-role="button" data-inline="true">Cancel lalalaalal</a>
<a href="index.html" data-role="button" data-theme="b" data-inline="true">Save</a>

이렇게 말이죠.^^





'----- IT ----- > jQuery Moblie' 카테고리의 다른 글

jQuery Mobile - Theming Buttons  (0) 2011.05.19
jQuery Mobile - Grouped Buttons  (0) 2011.05.18
jQuery Mobile - Custom icon  (0) 2011.05.17
jQuery Mobile - Button icons  (0) 2011.05.17
jQuery Mobile - Button markup options  (0) 2011.05.16

댓글