<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title>Bootstrap 实例 - 响应式表格</title>

        <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">

        <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>

        <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>

    </head>

    <body>

        <div class="table-responsive">

            <table class="table">

                <caption>响应式表格布局</caption>

                <thead>

                    <tr>

                        <th>产品</th>

                        <th>付款日期</th>

                        <th>状态</th>

                    </tr>

                </thead>

                <tbody>

                    <tr>

                        <td>产品1</td>

                        <td>23/11/2013</td>

                        <td>待发货</td>

                    </tr>

                    <tr>

                        <td>产品2</td>

                        <td>10/11/2013</td>

                        <td>发货中</td>

                    </tr>

                    <tr>

                        <td>产品3</td>

                        <td>20/10/2013</td>

                        <td>待确认</td>

                    </tr>

                    <tr>

                        <td>产品4</td>

                        <td>20/10/2013</td>

                        <td>已退货</td>

                    </tr>

                </tbody>

            </table>

        </div>      

    </body>

</html>

吴裕雄 Bootstrap 前端框架开发——Bootstrap 表格：响应式表格的更多相关文章

  1. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 网格系统实例：响应式的列重置

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 图片：响应式图片

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  3. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 图片：图片响应式 (将很好地扩展到父元素)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  4. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 辅助类：响应式实用工具

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  5. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表格：联合使用所有表格类

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  6. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表格：让表格更加紧凑

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  7. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表格：在 <tbody> 内的任一行启用鼠标悬停状态

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  8. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表格：为所有表格的单元格添加边框

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  9. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表格：在 <tbody> 内添加斑马线形式的条纹 ( IE8 不支持)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

随机推荐

  1. centos7.5下安装jenkins

    最近从头搭建了一套python+selenium+pytest+allure+Jenkins的环境,虽然网上挺多的,不过还是记录下来,毕竟坑还是挺多的....... 先从搭建jenkins开始把! 方 ...

  2. 区块链学习——HyperLedger-Fabric v1.0 启动过程分析

    本章我们从fabric v1.0的e2e_cli示例开始分析整个启动过程以及在过程中的一些配置文件 首先呢,还是确保你的基本环境已经搭建完成,v1.0源码和镜像也都下载完毕 fabric启动过程中的相 ...

  3. Emprie 使用基础笔记

    0x01 简介 empire 是一个后渗透攻击框架,具有加密通信和灵活框架的功能.Empire可以在不需要Powershell.exe的情况下执行PowerShell代理,后期利用的模块很强大,如sc ...

  4. 加密设备NAT对IPSec的影响

    加密设备NAT对IPSec VPN的影响:我们先配置好经典的IPSec VPN,然后在R3上做PAT看会对IPSec VPN产生什么影响(不会对有隧道的IPSec VPN技术产生影响). 现在默认配置 ...

  5. 从零搭建vue+express开发环境

    1.express,vue运行环境,2建express项目,3建vue项目,4将vue项目(3)输出文件拷贝到express静态根目录里 一:---------PC全局安装express 和 vue- ...

  6. 【原】从浏览器数据一个URL的全过程

    1.根据域名到DNS找到IP 2.根据IP建立TCP三次握手连接 3.连接成功发出http请求 4.服务器响应http请求 5.浏览器解析html代码并请求html中的静态资源(js/css) 6.关 ...

  7. Hive的学习之路（理论篇）

    一.Hive介绍 Apache官网给出的logo,一半是Hadoop大象的头,一半是蜜蜂的身体,也是寓意着它是基于Hadoop,哈哈,纯属个人理解,进入正题. Hive是基于Hadoop的一个数据仓库 ...

  8. Mapgis地图颜色配置（专题图配置）----对比Arcgis根据属性配置图斑颜色

    对于大多数arcgis用户来说,根据属性配置图斑颜色对于大家来说应该并不陌生.本文将就arcgis图斑颜色设置与mapgis做出比对,为大家提供更为绚丽的地图配色.    Arcgis颜色配置方案 右 ...

  9. i.MX RT600之I2S外设介绍及应用

    恩智浦的i.MX RT600是跨界处理器产品,同样也是i.MX RTxxx系列的开山之作.不同于i.MX RT1xxx系列单片机,i.MX RT600 采用了双核架构,将新一代Cortex-M33内核 ...

  10. 同一台服务器lnmpa环境下配置ip或域名访问不同站点

    1.配置域名访问 (1)添加虚拟主机 (2)nginx配置 cd /usr/local/nginx/conf/vhost vim zkadmin.zouke.com.conf (3)apache配置 ...