2014-03-26 57 views
2

为了澄清我的问题,我会背景图像下方附上草图图片:如何把内山坳-MD

Sketch

我想放在内的背景图像一个使用twitter-bootstrap的col-md。主要问题是如何把它放在col-md-7中。它的必备条件是,图像必须在所有以col-md-7命名的地方都可见,并且包括100%的高度。

我是twitter-bootstrap的初学者,我不确定col-md类是否可以让它延伸到页面底部。如果不是,使用bootstrap解决这个问题的解决方案是什么?

下面我的代码:

index.html.erb

<div class="container-fluid"> 
    <div class="row-fluid"> 
     <div class="col-md-7"> 
      <div class="container-fluid css_image_home"></div> 
     </div> 
     <div class="col-md-5"> 
      ... 
       </div> 
    </div> 
</div> 

home.css.scss

div.css_image_home{ 
    position:absolute; 
    background:url('images/wordcloud.jpg') no-repeat top left fixed; 
} 

我希望是提供解决这个问题所需的所有信息。如果缺少某些东西,请告诉我,我会尽快提供。

此致敬礼。

回答

1

http://www.bootply.com/125213

与背景图像的DIV的任何容器也需要100%的高度(车身,HTML,.container流体,等等。)

html,body { 
    height:100%; 
} 

.container-fluid,.col-md-7,.row { 
    height:100%; 
} 

另外, Bootstrap 3中没有row-fluid

+0

它对我很好,但我仍然有一个问题。更改twitter-bootstrap类的标准值不会干扰其他页面?或者它只是在主页上更改?谢谢。 – kamusett