jQuery Mobile 클...login
jQuery Mobile 클래식 튜토리얼
작가:php.cn  업데이트 시간:2022-04-11 13:58:34

jQuery 모바일 목록 보기





jQuery 모바일 목록 보기

jQuery Mobile의 목록 보기는 순서가 지정된(<ol>) 표준 HTML 목록입니다. 순서가 지정되지 않았습니다(<ul>).

목록 보기는 jQuery Mobile의 강력한 기능입니다. 표준 비순차 또는 순서 목록을 더 광범위하게 적용할 수 있습니다. 적용 방법은 ul 또는 ol 태그에 data-role="listview" 속성을 추가하는 것입니다. 사용자가 클릭할 수 있는 각 항목(<li>)에 링크를 추가하세요.

으아악

인스턴스 실행 »

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요.

목록 스타일의 둥근 모서리와 가장자리를 사용합니다. data-inset="true" 속성 설정:

으아악

인스턴스 실행 »

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요.


lamp 기본적으로 목록 항목의 링크는 자동으로 버튼으로 전환됩니다. (data-role="button"은 필요하지 않습니다).


구분된 목록

목록 항목은 목록을 구성하고 목록 항목을 그룹화하는 데 사용되는 목록 분할 항목으로 변환될 수도 있습니다.

목록 분할을 지정하려면 목록 항목<li> 요소에 data-role="list-divider" 속성을 추가하세요.

으아악

인스턴스 실행 중 »

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요.

전화번호부와 같은 알파벳순 목록이 있는 경우 <ol> 또는 <ul> 요소에 data-autodividers="true" 속성을 설정하여 자동으로 생성된 항목에 대한 구분 기호를 구성할 수 있습니다.

으아악

인스턴스 실행 중 »

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요.


lamp data-autodividers="true"는 자동 생성된 항목에 대한 구분 기호로 구성될 수 있습니다. 기본적으로 생성된 구분 텍스트는 목록 항목 텍스트의 첫 번째 대문자입니다.

实例

더 많은 예

읽기 전용 목록

으아악

인스턴스 실행 중 »

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요.

링크 없이 목록을 만드는 방법(버튼도 아니고 클릭할 수도 없음)

패널
목록에 패널을 삽입하는 방법

PHP 중국어 웹사이트