如何使Twitter启动模式全屏 [英] How to make Twitter bootstrap modal full screen

查看:208
本文介绍了如何使Twitter启动模式全屏的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-body">
    <%= image_tag "Background.jpg" %>
  </div>
</div>



我如何做一个Twitter的引导模式弹出全屏幕上面的代码,我试图玩弄css但不能得到它的方式我想要的。 。任何人都可以请帮我一下吧

How do I make a twitter bootstrap modal popup full screen for the above code, I tried playing around with css but was not able get it the way I wanted. Can anyone please help me with it.

推荐答案

我在引导3用下面的代码来实现这一点:

I achieved this in Bootstrap 3 with the following code:

.modal-dialog {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}

.modal-content {
  height: auto;
  min-height: 100%;
  border-radius: 0;
}

通常,当您对间距/填充问题有疑问时,单击(或cmd +单击mac)元素,并在Chrome上选择检查元素或在Firefox上使用firebug检查元素。尝试在元素面板中选择不同的HTML元素,并实时编辑右侧的CSS,直到获得所需的填充/间距。

In general, when you have questions about spacing / padding issues, try right+clicking (or cmd+clicking on mac) the element and select "inspect element" on Chrome or "inspect element with firebug" on Firefox. Try selecting different HTML elements in the "elements" panel and editing the CSS on the right in real-time until you get the padding / spacing you want.

这里是现场演示

Here is a live demo

这是一个指向小提琴的链接

这篇关于如何使Twitter启动模式全屏的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆