引文件：

<link href="dist/css/bootstrap.min.css" rel="stylesheet" />
    <link href="dist/css/bug-workaround.css" rel="stylesheet" />
    <script src="dist/js/jquery-1.12.4.js"></script>
    <script src="dist/js/bootstrap.min.js"></script>

菜單：

 <div class="container-fluid">
        <div class
 
="row">
            <div class="col-sm-3 col-md-2 sidebar">
                <ul class="nav nav-sidebar">
                    <li><a href="/home/backstage">關於我們</a></li>
                    <li><a href="/home/backstageb">建站案例</a></li>
                    <li><a href="
 
/home/backstagek">知識園地</a></li>
                    <li><a href="/home/backstagen">新聞資訊</a></li>
                    <li><a href="#">在線留言</a></li>
                </ul>

            </div>
        </div>
    </div>

模態框：

 <div style="
 
width:40px;height:20px;background-color:gray;" id="sr"></div>

        <div class="modal fade" id="gg" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                    <h4 class="modal-title">發布案列</h4>
                </div>

                <div class="modal-body">
                   
                        <h5>產品名:</h5>
                        <input type="text" name="bname" />
                        <h5 id="ts_name"></h5>
                        <h5>鏈接:</h5>
                        <input type="text" name="blink" />
                        <h5 id="ts_lj"></h5>
                       
                        <h5>圖片:</h5>
                        <input type="file" name="image" />
                        <h5 id="ts_tp"></h5>
                        <input type="submit" id="btn_fabu" class="btn btn-primary" value="發布" />
                    
                    <!--內容 結束-->
                </div>
                <div class="modal-footer">
                    <button id="Button4" type="button" class="btn btn-default" data-dismiss="modal">關閉</button>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>

一段js，點擊發生模態框：

 document.getElementById("sr").onclick = function () {
        $(‘#gg‘).modal({
            keyboard: true
        });

    }

bootstrap相關使用案例