5

こんにちは、ブートストラップを使用してドロップダウン ボタンを作成しようとしています。しかし、それは正しく出てこないようですか？

<div class="btn-group">
    <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
        Action
        <span class="caret"></span>
    </a>
    <ul class="dropdown-menu">
        <li><a href="#">Foo</a></li>
        <li><a href="#">Bar</a></li>
    </ul>
</div>

jsfiddle はこちらhttp://jsfiddle.net/UrgP8/

何か案は ？

ありがとう、

4

2 に答える 2

7

事実上完全なブーストラップ html ソースを html ビューに貼り付けることで、多量の外部リソースを jsfiddle にロードしています。

これは、3 つの外部ファイルのみをロードする、より必要最小限のバージョンです。

http://jsfiddle.net/BqKNV/65/

ベースのhtmlは同じです（コードを入れないと投稿できません...）

<div class="dropdown btn-group">
    <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
        Action
        <span class="caret"></span>
    </a>
    <ul class="dropdown-menu">
        <li><a href="#">Foo</a></li>
        <li><a href="#">Bar</a></li>
    </ul>
</div>

jQuery は jsFiddle のフレームワーク パネルを介してロードされ、ブートストラップ css および js はBootstrapCDNを介してロードされることに注意してください。

//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css
//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js

この html をページとして保存し、ブラウザで実行するとどうなりますか?

<!DOCTYPE html>
    <html>
    <head>
      <meta http-equiv="content-type" content="text/html; charset=UTF-8">
      <title> - jsFiddle demo</title>
      <script type='text/javascript' src='http://code.jquery.com/jquery-1.8.2.js'></script>
        <script type='text/javascript' src="http://twitter.github.com/bootstrap/assets/js/bootstrap.min.js"></script>
        <link rel="stylesheet" type="text/css" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
    </head>
    <body>
      <div class="dropdown btn-group">
        <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
            Action
            <span class="caret"></span>
        </a>
        <ul class="dropdown-menu">
            <li><a href="#">Foo</a></li>
            <li><a href="#">Bar</a></li>
        </ul>
      </div>
    </body>
    </html>
于 2012-12-22T00:40:03.697 に答える