bootstrap的强大功能毋庸置疑。所以，网站底部版权信息区可以用bootstrap的“栅格系统”完成。
下面是一个未经处理的底部版权信息区的样式：
1 <div class="container"> 2 <p>这里是底部信息的标题</p> 3 <div class="row"> 4 <!-- 部分：一 --> 5 <div class="col-md-3"> 6 <p>部分：一</p> 7 <div class="row"> 8 <div class="col-md-6"> 9 <ul> 10 <li>部分：一内容</li> 11 <li>部分：一内容</li> 12 <li>部分：一内容</li> 13 </ul> 14 </div> 15 <div class="col-md-6"> 16 <ul> 17 <li>部分：一内容</li> 18 <li>部分：一内容</li> 19 <li>部分：一内容</li> 20 </ul> 21 </div> 22 </div> 23 </div> 24 <!-- 部分：二 --> 25 <div class="col-md-6"> 26 <p>部分：二</p> 27 <ul> 28 <li>部分：二内容</li> 29 <li>部分：二内容</li> 30 <li>部分：二内容</li> 31 <li>部分：二内容</li> 32 <li>部分：二内容</li> 33 <li>部分：二内容</li> 34 </ul> 35 </div> 36 <!-- 部分：三 --> 37 <div class="col-md-3"> 38 <ul> 39 <li>部分：三内容</li> 40 <li>部分：三内容</li> 41 <li>部分：三内容</li> 42 <li>部分：三内容</li> 43 <li>部分：三内容</li> 44 <li>部分：三内容</li> 45 </ul> 46 </div> 47 </div> 48 49 </div>
直接偷懒引用：
<link rel="stylesheet" href="http://www.yanet.cn/css/bootstrap.min.css"> <script src="http://www.yanet.cn/js/jquery.min.js"></script> <script src="http://www.yanet.cn/js/bootstrap.min.js"></script>
------
到此，基本结构算是ok了，可以根据自己的需求修改具体的样式了。
【 微信扫一扫 】
