背景淡化下的bootstrap模态

时间:2016-12-17 20:04:39

标签: javascript bootstrap-modal

我正在为课程项目创建一个使用模态的网站,以便用户可以添加公告,日期和链接。现在我的模态显示在灰色渐变背景下。我已经在这个论坛上阅读了关于这个问题的3篇文章,但还没有解决我的问题。这是我的代码以及活动时模型的附加照片。

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
          <div class="modal-dialog" role="document">
            <div class="modal-content">
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">Important Report</h4>
              </div>
              <div class="modal-body">
                        <form class='form-horizontal' id = 'addItem'>
                             <div class='form-group'>
                               <label for='email'>New Item</label>
                               <input type='text' 
                                  id='newtext' 
                                  class='form-control'
                                  placeholder='type new text here' />
                             </div>
                             <div class='form-group'>
                               <label for='date'>Date</label>
                               <input type='dateTime' 
                                  id='date' 
                                  class='form-control' 
                                  placeholder='05/15/2016' />
                             </div>
                             <div class='form-group'>
                               <label for='link'>Item Link</label>
                               <input type='link' 
                                  id='link' 
                                  class='form-control' 
                                  placeholder='http://www.google.com' />
                             </div>
                        </form>
              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">close</button>
                <button type="button" class="btn btn-success">add new item</button>
              </div>
            </div>
          </div>
        </div>
        <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">new item</button>

Here's a picture of the modal when active

这段代码直接从教授网站上完全复制到我自己的代码,现在它无效。 (无法联系教授)

0 个答案:

没有答案