如何在引导程序中实现以下两列布局?

  • 第1列:宽度调整为可用尺寸,在分钟和最大宽度之间
  • 第2列:固定尺寸宽度

例如,如果我有:

  • 第1列宽度:300px
  • 第1列最大宽度:800px
  • 第2列宽度:400px

在可用宽度为800px的分辨率中,我希望这两列宽度为400px。在具有2000px的分辨率中,我希望第一列是800px,第二列为400px,屏幕右侧将有800px的空白空间。

有帮助吗?

解决方案

硬性很难,因为Bootstrap对响应迅速,非静态...有用...

可以通过这种方式正确: http://bootply.com/98214

html

<div class="row">
  <div id="col1" class="col-xs-6 col-md-5">coco 1</div>
  <div id="col2" class="col-xs-6 col-md-2">coco 2</div>
</div>

CSS

#col1{
  background:green;
  max-width:800px !important;
}

#col2{
  background:yellow;
  max-width:400px !important;
}

您不应该使用最小宽度,因为如果有额外的小设备,它不会有好的渲染

许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top