SOURCE

<section class="row'">
    <div style="  background-color:red;"class="col-xs-7">
    哦哈哈.........
  </div><br><br>
  
  <div  style="  background-color:yellow;" class="col-xs-6 col-xs-offset-2"> 弹幕来了..... </div><br><br> 
  
  <div style="background-color:green" class="col-xs-6 col-xs-offset-6">太好笑了....</div><br><br>
  
  <div style="  background-color:orange;"class="col-xs-6 col-xs-offset-1"> 是不是很像弹幕 </div><br><br>

   <div style="background-color:blue;" class="col-xs-6 col-xs-offset-4">遇见茉莉，享浪漫好礼</div><br><br>
  
  <div style="  background-color:black;"class="col-xs-5 col-xs-offset-3">扫二维码，抢....聚力会员</div><br><br>
  
  <div style="  background-color:green;"class="col-xs-5">这是静态的...放心，它不会动的</div><br><br>
  
  <div style="background-color:purple;" class="col-xs-4 col-xs-offset-2"><a href="http://ww.baidu.com">百度连接</a></div> <br><br>
  
  <div style="background-color:pink" class="col-sm-12">弹幕到此结束......</div><br><br>
  
<header><h2> 这又是一个新的。。。</h2></header>
  
  <nav>
    <a href="http://www.baidu.com">又是一个导航栏</a>|
    <a href="http://www.baidu.com">这个是什么呢</a>|
    <a href="http://www.baidu.com">该写点啥呢</a>|
    <a href="http://www.baidu.com">还写导航栏吧</a>|
  </nav>
  <div class="d">
  <section>
    这部分是section切换到极客黑模式 <br> 这部分是section切换到极客黑模式
    <br>  这部分是section切换到极客黑模式
  </section>
  </div>
  <div class="e">
  <artical>
    这部分是artical<br>
    这部分是artical<br>
    这部分是artical<br>
  </artical>
  </div>
  <div class="c">
  <aside>
    终于到aside了<br>
    终于到aside了<br>
    终于到aside了<br>
  </aside>
 </div>

.c{
  width:200px;
    height:90px;
  background:pink;
  position:absolute;
 left:265px;
 top:499px;
}
.d{
  width:275px;
  height:90px;
  position:absolute;
  top:499;
  background:yellow;
  
}
.e{width:280px;
height:40px
position:absolute;
  top:589px;
  background:green;
}