boostrap学习小记-给网站加一个简单大方的banner吧

boostrap学习小记-给网站加一个简单大方的banner吧

最近学习boostrap，发现很多boostrap网站都有看起来很大气的banner，结果分析了源码之后发现还是挺容易实现的。就试着做了一下。

原理很简单，在一个div.container外面加一个包裹div用于设置自己想要的背景，在 div. container里面加加一些文字信息，如果需要在各种屏幕宽度下表现出不同的效果，我们还可以给它加上一些响应式的设置。具体操作过程如下：

本文的例子都运行在如下的boostrap基本环境里面：

    
    
    

 rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">





    
    




    
    


<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> 

那么我们首先确定其基本结构，上面说了基本需求，使用一个 div. container为主要的内容存放块。在外面包裹一层用于设置背景的div块，在