zoukankan      html  css  js  c++  java
  • Bootstrap-缩略图

    效果图:

    代码:

    <div class="container">
              <ul class="media-list">
               <li class="media">
                   <div class="media-left">
                       <a href="#">
                           <img src="1.jpg" style="64px;height:64px">
                       </a> 
                    </div>
                    <div class="media-body">
                   <h4 class="media-heading">消息</h4>
                   Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.
                </div>   
               </li>
           </ul>
    
            <ul class="media-list">
               <li class="media">
                   <div class="media-left">
                       <a href="#">
                           <img src="1.jpg" style="64px;height:64px">
                       </a> 
                    </div>
                    <div class="media-body">
                   <h4 class="media-heading">消息</h4>
                   Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.
                    <ul class="media-list">
               <li class="media">
                   <div class="media-left">
                       <a href="#">
                           <img src="1.jpg" style="64px;height:64px">
                       </a> 
                    </div>
                    <div class="media-body">
                   <h4 class="media-heading">消息</h4>
                   Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.
                </div>   
               </li>
           </ul>
                </div>   
               </li>
           </ul>
    </div>
    View Code
  • 相关阅读:
    WEB浏览器与服务器通讯过程
    lua及luci学习
    让apache2不开机启动,管理Ubuntu的开机启动项
    在linux中如何调试C语言程序
    如何去除configure的默认选择-g O2
    C语言使用SQLite3数据库
    Linux下的C程序如何调用系统命令,并获取系统的输出信息到C程序中
    Opencv step by step
    Opencv step by step
    Opencv step by step
  • 原文地址:https://www.cnblogs.com/147258llj/p/5510298.html
Copyright © 2011-2022 走看看