?
This document uses PHP Chinese website manual Release
大于 16x16px 的圖像,請在鏈接中添加 <img> 元素。
jQuery Mobile 將自動縮放圖像到 80x80px:
效果預(yù)覽 ?<ul data-role="listview">
? <li><a href="#"><img src="chrome.png"></a></li>
</ul>
使用標準的HTML添加列表信息:
效果預(yù)覽 ?<ul data-role="listview">
? <li>
??? <a href="#">
??? <img src="chrome.png">
??? <h2>Google Chrome</h2>
??? <p>Google Chrome 免費的開源 web 瀏覽器。發(fā)布于 2008 年。</p>
??? </a>
? </li>
</ul>
在列表 <img> 元素使用 class="ui-li-icon" 添加 16x16px 圖標:
效果預(yù)覽 ?<li><a href="#"><img src="us.png" alt="USA" class="ui-li-icon">USA</a></li>
在JQuery Mobile的列表中,有時需要對選項內(nèi)容做兩個不同的操作,這時,需要對選項中的鏈接按鈕進行分割。實現(xiàn)分割的方法是在<li>元素中再增加一個<a>元素,便可以在頁面實現(xiàn)分割效果。
jQuery Mobile 會自動設(shè)置第二個鏈接為藍色箭頭的圖標,圖標的鏈接文字(如果有的話)將在用戶將鼠標懸停在 圖標時顯示:
效果預(yù)覽 ?<ul data-role="listview">
? <li>
??? <a href="#"><img src="chrome.png"></a>
??? <a href="#">Some Text</a>
? </li>
</ul>
添加一些頁面和對話框使鏈接功能更加豐富:
效果預(yù)覽 ?<ul data-role="listview">
? <li>
??? <a href="#"><img src="chrome.png"></a>
??? <a href="#download" data-rel="dialog">下載瀏覽器</a>
? </li>
</ul>
氣泡數(shù)字是用來顯示列表項相關(guān)的數(shù)字,如在一個郵箱的郵件:
如需添加氣泡數(shù)字,請使用行內(nèi)元素,比如 <span>,設(shè)置 class "ui-li-count" 屬性并添加數(shù)字:
效果預(yù)覽 ?<ul data-role="listview">
? <li><a href="#">收件箱<span class="ui-li-count">25</span></a></li>
? <li><a href="#">發(fā)件箱<span class="ui-li-count">432</span></a></li>
? <li><a href="#">垃圾箱<span class="ui-li-count">7</span></a></li>
</ul>
注意:顯示一個正確的氣泡數(shù)字,必須修改編程方式。 這將在以后的章節(jié)解釋。
改變列表項的默認鏈接圖標
如何設(shè)置列表項的默認鏈接圖標(默認是右箭頭).
可折疊的列表
如何創(chuàng)建顯示/隱藏的列表。
更多內(nèi)容格式
如何制作一個日歷。