0

有没有办法在标题中有一个导航栏，后跟一个图标？

我唯一能做的就是在导航栏中的第三个菜单中有图标：

http://tof.canardpc.com/view/f0ad5385-09d9-4624-9324-d6cad4e0aad7.jpg

    <div data-role="navbar" data-theme="a">
        <ul>
            <li><a href="#nav1">Nav 1</a></li>
            <li><a href="#nav2">Nav 2</a></li>
            <li><a href="#nav3">Nav 3</a></li>

        </ul>

    </div>
    <a href="index.html" data-role="button" data-icon="home" data-theme="a" 
     class="ui-btn-right" data-iconpos="notext">Home</a>

</div>

我可以以编程方式做到这一点吗？就像每个标题中的后退按钮一样？

$.mobile.page.prototype.options.backBtnText = "previous";
4

1 回答 1

0

首先，您想要实现的目标我无法理解，但是从您提供的图像来看，这意味着您想在导航栏的右侧制作一个主页图标...

为了实现，您可以使用 css 并将其包含到导航栏中...

只需在 li 中添加不同的类并为它们提供不同的宽度......

HTML：

<div data-role="haeder" data-theme="a">
        <ul data-role="navbar" data-theme="a">
            <li class="tap1"><a href="#nav1">Nav 1</a></li>
            <li class="tap2"><a href="#nav2">Nav 2</a></li>
            <li class="tap3"><a href="#nav3">Nav 3</a></li>
            <li class="tap4"><a href="index.html" data-role="button" data-icon="home" data-theme="a" class="ui-btn-right" data-iconpos="notext">Home</a></li>

        </ul>

    </div>

CSS，

.tap1 { width:30% !important; }
.tap2 { width:30% !important; }
.tap3 { width:30% !important; }
.tap4 { width:10% !important; }

您可以根据需要调整宽度百分比...

于 2012-06-20T05:04:38.533 回答