首页 > 其他 > 详细

Bootstrap 列表组

时间:2015-03-16 15:52:06      阅读:257      评论:0      收藏:0      [点我收藏+]

基本的列表组:

向元素 <ul> 添加 class .list-group

向 <li> 添加 class .list-group-item

<ul class="list-group">
   <li class="list-group-item">免费域名注册</li>
   <li class="list-group-item">免费 Window 空间托管</li>
   <li class="list-group-item">图像的数量</li>
   <li class="list-group-item">24*7 支持</li>
   <li class="list-group-item">每年更新成本</li>
</ul>

 

向列表组添加链接

<div class="list-group">
    <a href="#" class="list-group-item active">免费域名注册</a>
    <a href="#" class="list-group-item">24*7 支持</a>
    <a href="#" class="list-group-item">免费 Window 空间托管</a>
    <a href="#" class="list-group-item">图像的数量</a>
   <a href="#" class="list-group-item">每年更新成本</a>
</div>

向列表组添加自定义内容

<div class="list-group">
   <a href="#" class="list-group-item active">
      <h4 class="list-group-item-heading">
         入门网站包
      </h4>
   </a>
   <a href="#" class="list-group-item">
      <h4 class="list-group-item-heading">
         免费域名注册
      </h4>
      <p class="list-group-item-text">
         您将通过网页进行免费域名注册。
      </p>
   </a>
   <a href="#" class="list-group-item">
      <h4 class="list-group-item-heading">
         24*7 支持
      </h4>
      <p class="list-group-item-text">
         我们提供 24*7 支持。
      </p>
   </a>
</div>

 

Bootstrap 列表组

原文:http://www.cnblogs.com/liuyuanhao/p/4341918.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!