1

私は本当にあなたの助けが必要です。ブートストラップモーダルを使用しようとしています。それを機能させるのに3〜4時間かかりました。私がテンプレートを使用していることを考えると、ブートストラップ JavaScript が書き直されていたようです。私はそれを機能させる方法を見つけました。

しかし今、問題はモデルがまったくスタイルなしで表示されていることです:

前 :

前

後 :

ここに画像の説明を入力

私は本当にあなたの助けが必要です.私はここで立ち往生しており、それを解決する方法が本当にわかりません. bootstrap.css はすべてのシートで機能するように見えるため、これが問題かどうかはわかりません。

ここでモーダルを呼び出す方法:

<div class="modal-backdrop fade in"  ></div>
   <div class="modal hide fade in" id="myModal" style="display: none;">
       <div class="modal-header">
           <a class="close" href="#">×</a>
           <h3>Modal Heading</h3>
       </div>
       <div class="modal-body">
            <p>One fine body…&lt;/p>
       </div>
       <div class="modal-footer">
           <a class="btn primary" href="#">Primary</a>
           <a class="btn secondary" href="#">Secondary</a>
       </div>
</div>

<div class="bs-docs-example" style="padding-bottom: 24px;">
       <a data-toggle="modal" href="#myModal" class="btn btn-primary btn-large" data-backdrop="static" >Launch demo modal</a>
</div>

ご協力ありがとうございました !

4

2 に答える 2

2

私はこれが答えには遅すぎることを知っていますが、他の誰かが解決策を探している場合に備えて、

ブートストラップ モデル ポップアップの標準的な div 構造は次のとおりです。

<div id="myModal" class="modal fade" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Modal title goes here</h4>
            </div>
            <div class="modal-body">
                Some text to popup
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

この場合、「modal-dialog」および「modal-content」クラスを見逃しています。必要に応じて、div ID「myModal」を置き換えます。

お役に立てれば。

于 2016-09-07T03:33:24.377 に答える