全屏响应背景图像与引导程序

zac*_*ack 9 html css jquery twitter-bootstrap

我是twitters bootstrap的新手.我想知道的HTML模型是否必须用于带有引导程序的全屏响应式背景图像?

当然我在起诉模型

<div class="container-fluid">

<div class="wrapper">

</div>


</div>
Run Code Online (Sandbox Code Playgroud)

在包装之前,我有一个导航菜单.我想为div类包装器添加一个全屏图像.我希望包装div能够扩展到100%.任何提示将不胜感激.

Ann*_*agg 21

两种选择

  1. img-responsive如果您使用标记,请使用类.

    <div class="wrapper">
       <img src="pic_1.jpg" class="img-responsive" alt="Responsive image">
    </div>
    
    Run Code Online (Sandbox Code Playgroud)
  2. 如果你使用css使用这个.

    .wrapper{background: url('/assets/64531/green_suburb.jpg') no-repeat   center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;}
    
    Run Code Online (Sandbox Code Playgroud)