1

问题：

我的导航栏看起来不像http://jquerymobile.com/test/docs/toolbars/footer-persist-a.html示例中的导航栏

我在做什么错/不同？

JS 小提琴：http: //jsfiddle.net/OpnSrce/dUcUF/

编码：

<!DOCTYPE HTML>
<html>
    <head>
        <meta charset = "utf-8">
        <meta name = "viewport" content = "width=device-width, initial-scale=1">
        <title>AD&amp;D Spellbook</title>
        <style>
            @import url('http://code.jquery.com/mobile/1.1.0-rc.2/jquery.mobile-1.1.0-rc.2.min.css');
        </style>
        <script src = "http://code.jquery.com/jquery-1.7.1.min.js"></script>
        <script src = "http://code.jquery.com/mobile/1.1.0-rc.2/jquery.mobile-1.1.0-rc.2.min.js"></script>
    </head>

    <body>
        <div data-role = "page" data-theme = "b">
            <div data-role = "header" data-position = "fixed" data-theme = "b">
            </div>
            <div data-role = "content" data-theme = "b">

            </div>
            <div data-role = "footer" data-position = "fixed" data-theme = "b">
                <div data-role = "navbar">
                    <ul>
                        <li>All Spells</li>
                        <li>Memorized Spells</li>
                        <li>Known Spells</li>
                    </ul>
                </div>
            </div>
        </div>
    </body>
</html>
4

1 回答 1

2

好的，我改变了我的答案第一个版本是错误的。您缺少的是<a>页脚中的标签。

<div data-role="navbar">
    <ul>
        <li><a href="">All Spells</a></li>
        <li><a href="">Memorized Spells</a></li>
        <li><a href="">Known Spells</a></li>
    </ul>
</div>
于 2012-04-07T18:26:05.737 回答