html - 不跨越整个容器流体的背景图像

标签 html css twitter twitter-bootstrap background-image

我是这个 Bootstrap 的新手。我有一个背景图像,我想将其放入容器流体中。怎么做。

这是我的代码:

<div class="image_outer">
    <div class="container-fluid">
         <div class="row-fluid">
                <div class="span5">
                     <div class="fl navi"> <a href="#" title="One" class="mr30">One</a> <a href="#" title="two">TwoP</a> </div>
                </div>
                <div class="span2"">
                     <div id="image1"><img src="/Something/something.jpg" alt="" /></div>
                </div>
                <div class="span5">
                     <div class="fr navi"> <a href="#" title="three" class="mr30">Three</a> <a href="#" title="four">Four</a> </div>
                </div>
         </div>
    </div>
</div>

对应的类是

.image_outer{width:100%;margin:0 auto; background:url(Something/something_bg.jpg) repeat-x; height:128px;}
.fl{float:left;}
.fr{float:right;}
.mr30{margin-right:100px; font-family: ee_nobblee,arial;}
.navi a{ font-size:22px; color:#6D6E70; margin-top:50px; float:left; font-weight:normal; font-family:ee_nobblee,arial;}
.navi a:hover { text-decoration:none; color:#858687;}

最佳答案

试试这个 CSS:

.image_outer {
   width:100%;
   margin:0 auto; 
   background:url(Something/something_bg.jpg) repeat-x; 
   height:128px; 
   background-position:cover;
}

关于html - 不跨越整个容器流体的背景图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12620099/

相关文章:

html - 为什么在 IE 中文本框不调整到整个 div? Chrome 很好

html - 为什么文本出现在具有高 z-index 的图像上方

html - 这个标记有什么 "wrong"吗?

html - 将鼠标悬停在 div 上时显示 div

html - 你将如何在 iOS 上的 UIWebView 中创建一个新的本地 HTML 文件?

html - 浏览器高度为 100% 的静态和流动列

c# - 你如何使用 webbrowser 控件进行样式设置但具有 C# 中的逻辑?

javascript - 我应该如何处理 firebase 登录错误?

c# - 在 C# 中更新 Twitter 状态

c# - DateTime.ParseExact() 尝试解析 twitter api created_at 时抛出异常