解决Bootstrap3模态框遮罩挡住窗口及窗体大小问题

简单起见，就不介绍问题背景了，遇到的问题如下：
可以看到遮罩将我想显示的模态框挡住了，而且因为被遮住的原因，在google浏览器中当模态框高度超过主窗口高度时虽然显示了滚动条，但无法滚动，而且默认设置下模态框被其他页面元素遮挡住了。

解决后的效果如下：

解决方法其实很简单，就是设置一下模态框的两个属性即可：
1、在模态框最外层div中设置样式中设置margin-top属性使对话框顶部保持间距，解决对话框高度超过范围时顶部被遮挡问题，在我的页面上，设置margin-top为28效果较好，具体情况需要根据页面布局不断进行尝试；
2、将data-backdrop属性设置为false以去掉遮罩。

<!-- 模态框（Modal） -->
        @*在模态框最外层div中设置样式中设置margin-top属性使对话框顶部保持间距，解决对话框高度超过范围时顶部被遮挡问题*@
        @*将data-backdrop属性设置为false以去掉遮罩*@
        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" 
        	aria-hidden="true" data-backdrop="false" style="margin-top:28px;">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header pager-text-color" style="padding:10px 10px;">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title" id="myModalLabel">模态框（Modal）标题</h4>
                    </div>
                    <div class="modal-body" style="height:1000px;">在这里添加一些文本</div>
                    @*<div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        <button type="button" class="btn btn-primary">提交更改</button>
                    </div>*@
                </div><!-- /.modal-content -->
            </div><!-- /.modal -->
        </div>

这个问题耗费了一下午时间在网上找解决方法，但效果不理想，最后通过结合网上的解决方法以及bootstrap模态框的文档介绍，以及使用浏览器的开发者工具检查页面模态框的样式，最终发现了这个简洁的解决方法。

参考链接：
1、bootstrap 模态框弹出时被遮罩层挡住了，怎么解决 https://ask.csdn.net/questions/260668
2、菜鸟教程或bootstrap中文网 https://www.runoob.com/bootstrap/bootstrap-modal-plugin.html

菜鸟教程中的这个选项很重要！