html – Bootstrap中的背景图像_html-js-css

概述我已经尝试了以下代码,由于某种原因,我的背景图像不占用整个页面,它只覆盖导航栏.我应该在以下代码中更改什么？另外,如何使导航栏跨越网页的整个宽度？ <!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Example of Bootstrap 3 Static Navbar</title><link rel=" 我已经尝试了以下代码,由于某种原因,我的背景图像不占用整个页面,它只覆盖导航栏.我应该在以下代码中更改什么？另外,如何使导航栏跨越网页的整个宽度？

<!DOCTYPE HTML><HTML lang="en"><head><Meta charset="UTF-8"><Title>Example of bootstrap 3 Static Navbar</Title><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/CSS/bootstrap.min.CSS"><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/CSS/bootstrap-theme.min.CSS"><script src="https://AJAX.GoogleAPIs.com/AJAX/libs/jquery/1.11.3/jquery.min.Js"></script><script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/Js/bootstrap.min.Js"></script><style type="text/CSS">    .bs-example{        margin: 20px;    }</style></head><body><div  ><div >    <nav ID="myNavbar" >        <div >            <div >                <@R_301_5554@ type="@R_301_5554@"  data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">                    <span >Toggle navigation</span>                    <span ></span>                    <span ></span>                    <span ></span>                </@R_301_5554@>                <a  href="#">TNP</a>            </div>            <div  ID="bs-example-navbar-collapse-1">                <ul >                    <li><a href="#">Home</a></li>            <li >            <a href="#" data-toggle="dropdown" >CompanIEs<b ></b></a>               <ul >                <li >                <li><a href="#">Rakuten</a></li>                <li><a href="#">Morgan Stanley</a></li>                <li><a href="#">TCS</a></li>                <li><a href="#">NvIDia</a></li>            </ul>             </li>                    <li >                        <a href="#" data-toggle="dropdown" >Student <b ></b></a>                        <ul >                            <li><a href="#">Login</a></li>                            <li><a href="#">Drafts</a></li>                            <li><a href="#">Sent Items</a></li>                            <li ></li>                            <li><a href="#">Trash</a></li>                        </ul>                    </li>            </div>        </div>    </nav></div></div></body></HTML>

解决方法使用class container-fluID代替容器使其使用整个宽度.

并且需要给容器一个高度.目前它会随着你在其中添加更多元素而增长.

这是FIDDLE.

总结

以上是内存溢出为你收集整理的html – Bootstrap中的背景图像全部内容，希望文章能够帮你解决html – Bootstrap中的背景图像所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。

欢迎分享，转载请注明来源：内存溢出

原文地址: http://outofmemory.cn/web/1061356.html