반응형
jQuery Mobile에서 Layout Grids (columns)
한 줄에 버튼 여러개 놓기. (최대는 5개 까지 입니다.)
- two-column (using the
ui-grid-a
class) - three-column (using the
ui-grid-b
class) - four-column (using the
ui-grid-c
class) - five-column (using the
ui-grid-d
class)
화면 구성은 다음과 같다.
코드 구성은 아래와 같다.
<div class="ui-grid-a">
<div class="ui-block-a"> <button>A</button></div>
<div class="ui-block-b"> <button>B</button></div>
{..또는 반복처리..}
</div>
참고: http://demos.jquerymobile.com/1.1.2/docs/content/content-grids.html
3개의 컬럼 구조 예제 화면.
반응형
'Web > jQuery' 카테고리의 다른 글
jQuery Mobile의 header와 ui-content 여백 줄이기 (0) | 2020.02.14 |
---|---|
jQuery <select>의 <option>변경하기 + 멀티 콤보박스(Multi-Select Combo box) (0) | 2019.09.26 |
jQuery Mobile 의 <textarea> 높이 (height) rows 값 적용되게 설정하기 (0) | 2019.06.12 |
jQuery Mobile 1.4 SVG Icon (0) | 2018.12.05 |
jQuery Mobile: document ready vs. page events (0) | 2018.06.03 |
jQuery Mobile Button 숨기기 (0) | 2018.06.03 |
jQuery Mobile 화면 최상단으로 Scroll 이동하기 (0) | 2018.06.02 |
jQuery 특정 id 객체로 화면 스크롤링 해서 이동하기 (0) | 2018.06.02 |
도움이 되셨다면 하트모양의 "♡ 공감"을 눌러주시면 큰 격려가 됩니다.
(로그인하지 않으셔도 가능)
(로그인하지 않으셔도 가능)