javascript - 带有链接的 jQuery Mobile 列表格式

Question

我创建了一个简单的 jQuery Mobile 页面 - 将相关示例放在这里:

http://jsfiddle.net/EhyKa/

我不希望包含链接的 li 项，在本例中，Phone H、Phone M 和 Phone W 项的格式与列表中的其他项不同。目前，文本和链接被拆分成单独的行，并且与其他元素相比具有不同的样式。

任何人都可以指出我需要更改哪些内容以使其保持一致(我认为是 CSS 还是 JavaScript？)。

非常感谢， 史蒂夫

Answer 1

更改样式应该可以解决问题。将锚定为内联 block 。并给出适当的填充。

修改后的代码如下

<div data-role="page" id="details" data-add-back-btn="true"> 
    <div data-role="header">
    <a href="../page.php" data-icon="home" class="ui-btn-right">Home</a>
    <h1>Contact Details</h1>
    </div>
    <div  data-role="content">

    <ul data-role="listview" data-inset="true" data-dividertheme="b">
            <li>First Name: Tom</li>
            <li>Surname: Jones</li>
            <li data-icon="false" style="height:35px;padding-left:15px;font-size:14px">Phone H: <a href="tel:123 4567" style="display:inline-block;padding-left:0px">123 4567</a></li>
            <li data-icon="false" style="height:35px;padding-left:15px;font-size:14px">Phone W: <a href="tel:123 4567" style="display:inline-block;padding-left:0px">123 4567</a></li>
            <li data-icon="false" style="height:35px;padding-left:15px;font-size:14px">Phone M: <a href="tel:123 4567" style="display:inline-block;padding-left:0px">123 4567</a></li>
        </ul>

    </div>

</div>

</body>
</html>