Question

jQuery Mobile中有一个例子：Up and Running，显示包含标题，描述和链接的交互式列表

http://my.safaribooksonline.com/book/-/9781449331085/4dot-lists/id2712982

我找不到这个代码，到目前为止我能够重现相同效果的唯一方法是将<hX>元素嵌套在<a>中，我理解的是糟糕的做法。

任何人都可以建议正确的方法来实现这一目标吗？下面的示例有效，但只能嵌入。

内部

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8" />
    <title>List Example</title>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" />
    <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script>
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head> 

<body>
    <div data-role="page" id="example">

        <div data-role="header" data-theme="c">
            <h2>List Example</h2>
        </div>

        <div data-role="content">

            <ul data-role="listview" >
                <li>
                    <a href="#">
                    <h3>Title1</h3>
                    <p>Description1</p>
                    </a>
                </li>
                 <li>
                    <a href="#">
                    <h3>Title2</h3>
                    <p>Description2</p>
                    </a>
                </li>
              </ul>
        </div>

</body>

</html>

Answer 1

来自JQM docs（在“文字格式和计数”下）

要添加文本层次结构，请使用标题来增加字体强调和使用减少重点的段落。

所以这似乎是正确的方法。也就是说你可以在li中嵌套任何你想要的东西并使用`CSS'来设置它。

jQuery Mobile：如何创建带标题和描述的链接行

1 个答案: