代码如下:

<!DOCTYPE html>
<html>
<head>
<title>BootStrap的基础入门</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<script src="bootstrap/js/jquery-1.10.2.min.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
</head>
<body style="padding: 50px;background-color: #CCCCCC">
<div class="container" style="background-color: #ffffff;padding: 50px">
<!--                 <h1 class="text-center">有了Html,<del>css和js就能学习</del></h1>
  <ul class="list-inline">
  <li>java</li>
  <li>Python</li>
  <li>ruby</li>
  </ul>
  <p>由两个前端设计师开发的一个前端的框架(Html,css,js)</p>              -->
<div class="table-responsive">
<table class="table table-hover " >
<tr class="active">
<td> java</td>
<td> python</td>
<td> ruby</td>
<td> .net</td>
</tr>
<tr class="success">
<td> zhl</td>
<td> zhl</td>
<td> zhl</td>
<td> zhl</td>
</tr>
<tr class="info">
<td> zhl</td>
<td> zhl</td>
<td> zhl</td>
<td> zhl</td>
</tr>
<tr class="warning">
<td> zhl</td>
<td> zhl</td>
<td> zhl</td>
<td> zhl</td>
</tr>
<tr class="danger">
<td> zhl</td>
<td> zhl</td>
<td> zhl</td>
<td> zhl</td>
</tr>
</table>
</div>
</div>
</body>
</html>

  

BootStrap的table表格的基本写法的更多相关文章

  1. BootStrap的table表格,栅格系统,form表单的样式

    BootStrap BootStrap的简介 1.    什么是Bootstrap 由两个前端设计师开发的一个前端的框架(Html,css,js) 简化了程序员写css的代码 2.    为什么使用B ...

  2. 关于Vue.cli 脚手架环境中引入Bootstrap时,table表格样式缺失的解决办法

    Vue+bootstrap不能正常使用table的样式 环境:下载官网的本地bootstrap包,然后在vue 的index.html引入bootstrap的css和js环境 问题描述:1. vue里 ...

  3. bootstrap学习笔记<四>(table表格)

    表格 bootstrap为table表格定制多个常用样式:基本样式,隔行变色样式,带边框样式,荧光棒样式,紧凑样式,响应样式. ☑  .table:基础表格 ☑  .table-striped:斑马线 ...

  4. JS组件系列——Bootstrap Table 表格行拖拽(二:多行拖拽)

    前言:前天刚写了篇JS组件系列——Bootstrap Table 表格行拖拽,今天接到新的需要,需要在之前表格行拖拽的基础上能够同时拖拽选中的多行.博主用了半天时间研究了下,效果是出来了,但是感觉不尽 ...

  5. Bootstrap Table表格一直加载(load)不了数据-解决办法

    bootstrap-table是一个基于Bootstrap风格的强大的表格插件神器,官网:http://bootstrap-table.wenzhixin.net.cn/zh-cn/ 这里列出遇到的一 ...

  6. bootstrap table表格属性、列属性、事件、方法

    留存一份,原文地址http://bootstrap-table.wenzhixin.net.cn/zh-cn/documentation/ 表格参数 表格的参数定义在 jQuery.fn.bootst ...

  7. Bootstrap <基础五>表格

    Bootstrap 提供了一个清晰的创建表格的布局.下表列出了 Bootstrap 支持的一些表格元素: 标签 描述 <table> 为表格添加基础样式. <thead> 表格 ...

  8. Table表格的一些操作

    首先创建一个table表格: <input type="button" id="btn1" value="获取数据" /> &l ...

  9. 【Bootstrap】 bootstrap-table表格组件

    [Bootstrap-table] 顾名思义,这个组件专注于bootstrap风格的表格的设计,并且提供了很多表格的基础和进阶的功能,给我们开发前端的表格省下很多力气. 本文主要参考这位博主的系列文章 ...

随机推荐

  1. [NOI2011]兔兔与蛋蛋游戏 二分图博弈

    题面 题面 题解 通过观察,我们可以发现如下性质: 可以看做是2个人在不断移动空格,只是2个人能移动的边不同 一个位置不会被重复经过 : 根据题目要求,因为是按黑白轮流走,所以不可能重复经过一个点,不 ...

  2. C++11Mutex(互斥锁)详解

    多个线程访问同一资源时,为了保证数据的一致性,最简单的方式就是使用 mutex(互斥锁). (1).直接操作 mutex,即直接调用 mutex 的 lock / unlock 函数.此例顺带使用了 ...

  3. Tajo--一个分布式数据仓库系统(设计架构)

    上一篇Tajo--一个分布式数据仓库系统(概述)废话了一通,下面介绍一下Tajo的体系结构.以及官方的实验成果吧 一.体系架构 Tajo采用了Master-Worker架构(下图虚线框目前还在计划中) ...

  4. [学习笔记]矩阵乘法及其优化dp

    1.定义: $c[i][j]=\sum a[i][k]\times b[k][j]$ 所以矩阵乘法有条件,(n*m)*(m*p)=n*p 即第一个矩阵的列数等于第二个矩阵的行数,否则没有意义. 2.结 ...

  5. 编写优质嵌入式C程序(转)

    前言:这是一年前我为公司内部写的一个文档,旨在向年轻的嵌入式软件工程师们介绍如何在裸机环境下编写优质嵌入式C程序.感觉是有一定的参考价值,所以拿出来分享,抛砖引玉. 转载请注明出处:http://bl ...

  6. poj3421 X-factor Chains

    X-factor Chains Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 7733   Accepted: 2447 D ...

  7. 洛谷P1821 [USACO07FEB]银牛派对Silver Cow Party

    题目描述 One cow from each of N farms (1 ≤ N ≤ 1000) conveniently numbered 1..N is going to attend the b ...

  8. 手脱ASPack v2.12

    1.PEID查壳提示为: ASPack 2.12 -> Alexey Solodovnikov 2.载入OD,程序入口点是一个pushad,在他的下一行就可以进行ESP定律,下硬件访问断点然后s ...

  9. UVA 12520 Square Garden

    https://vjudge.net/problem/UVA-12520 题意:n*n网格中染色m个格子,染色格子的最长轮廓线 贪心 将格子分为4类 1.隔一个选一个,互不相邻的格子 2.4个角上的格 ...

  10. C11关键字&字面值改善

    1.原始字面值改善 原始字面值可以直接表示字符串的实际含义,但是一些特殊字符就需要转义. std::string str = "D:\A\B\test.txt"; std::cou ...