我正在开发一个具有某种“协调器”界面的网络应用程序。我希望能够支持我正在使用的 Eyefinity 设置(即 3 个纵向显示器,分辨率为 3600x1920,或 3780x1920,并启用了边框校正)。
我正在使用 Twitter Bootstrap,我认为它的响应式设计功能满足我的需要,但我不确定如何根据我的需要对其进行自定义。
我基本上需要 3 列,每列大约 1200 像素宽,但我希望当屏幕宽度小于 1920 像素宽时,这些列分解为 3 行。
这可以通过向 responsive.less
文件集添加另一类设备来完成吗?
这是我目前正在使用的代码:
<div class="row-fluid">
<div class="span4"></div>
<div class="span4"></div>
<div class="span4"></div>
</div>
下面是一些测试截图:
最佳答案
好吧,这比我预期的要容易。
我所要做的就是将一个类添加到我的顶级行(我称之为 row-eyefinity),然后将以下 CSS 添加到我的样式表中:
@media (max-width:3500px) {
.row-eyefinity > [class*="span"] {
float: none;
display: block;
width: auto;
margin-left: 0;
}
}
关于html - Bootstrap 脚手架 @ 3600x1920,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10784176/