使我的代码正确

时间:2017-01-14 19:53:35

标签: javascript jquery html css

有人可以告诉我代码中是否有错误吗?

我正在使用bootsrap是js和css文件,在下面的代码中它应该打开一个对话框,但我不知道为什么它不起作用。我想确定这一切是否正常

<div class="modal fade details-1" id="details-1" tabindex="-1" role="dialog" aria-labelledby="details-1" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-header">
            <button class="close" type="button" data-dismiss="modal" aria-label="close">
                <span aria-hidden="true">&times;</span>
            </button>
            <h4 class="modal-title text-center">Levis Jeans</h4>
        </div>
        <div class="modal-body">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-sm-6">
                        <div class="center-block">
                            <img src="images/products/men4.png" alt="Levis Jeans" class="details img-responsive">
                        </div>
                    </div>
                    <div class="col-sm-6"></div>
                </div>
            </div>
        </div>
    </div>
</div>

2 个答案:

答案 0 :(得分:1)

你错过了一个包装器。

<div class="modal fade details-1" id="details-1" tabindex="-1" role="dialog" aria-labelledby="details-1" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <button class="close" type="button" data-dismiss="modal" aria-label="close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title text-center">Levis Jeans</h4>
            </div>
            <div class="modal-body">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-sm-6">
                            <div class="center-block">
                                <img src="images/products/men4.png" alt="Levis Jeans" class="details img-responsive">
                            </div>
                        </div>
                        <div class="col-sm-6"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="btn btn-info" data-toggle="modal" data-target="#details-1"> Open</div>

div.modal-content下添加.modal-dialog

答案 1 :(得分:0)

您忘记添加课程<div class="modal-content">,这是工作模式

&#13;
&#13;
<div class="modal-content">
&#13;
&#13;
&#13;