BootStrap的table表格的基本写法

代码如下:
<!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表格的基本写法的更多相关文章
- BootStrap的table表格,栅格系统,form表单的样式
BootStrap BootStrap的简介 1. 什么是Bootstrap 由两个前端设计师开发的一个前端的框架(Html,css,js) 简化了程序员写css的代码 2. 为什么使用B ...
- 关于Vue.cli 脚手架环境中引入Bootstrap时,table表格样式缺失的解决办法
Vue+bootstrap不能正常使用table的样式 环境:下载官网的本地bootstrap包,然后在vue 的index.html引入bootstrap的css和js环境 问题描述:1. vue里 ...
- bootstrap学习笔记<四>(table表格)
表格 bootstrap为table表格定制多个常用样式:基本样式,隔行变色样式,带边框样式,荧光棒样式,紧凑样式,响应样式. ☑ .table:基础表格 ☑ .table-striped:斑马线 ...
- JS组件系列——Bootstrap Table 表格行拖拽(二:多行拖拽)
前言:前天刚写了篇JS组件系列——Bootstrap Table 表格行拖拽,今天接到新的需要,需要在之前表格行拖拽的基础上能够同时拖拽选中的多行.博主用了半天时间研究了下,效果是出来了,但是感觉不尽 ...
- Bootstrap Table表格一直加载(load)不了数据-解决办法
bootstrap-table是一个基于Bootstrap风格的强大的表格插件神器,官网:http://bootstrap-table.wenzhixin.net.cn/zh-cn/ 这里列出遇到的一 ...
- bootstrap table表格属性、列属性、事件、方法
留存一份,原文地址http://bootstrap-table.wenzhixin.net.cn/zh-cn/documentation/ 表格参数 表格的参数定义在 jQuery.fn.bootst ...
- Bootstrap <基础五>表格
Bootstrap 提供了一个清晰的创建表格的布局.下表列出了 Bootstrap 支持的一些表格元素: 标签 描述 <table> 为表格添加基础样式. <thead> 表格 ...
- Table表格的一些操作
首先创建一个table表格: <input type="button" id="btn1" value="获取数据" /> &l ...
- 【Bootstrap】 bootstrap-table表格组件
[Bootstrap-table] 顾名思义,这个组件专注于bootstrap风格的表格的设计,并且提供了很多表格的基础和进阶的功能,给我们开发前端的表格省下很多力气. 本文主要参考这位博主的系列文章 ...
随机推荐
- HBase多租户机制分析
在HBase1.1.0发布之前,HBase同一集群上的用户.表都是平等的,没有优劣之分.这种’大同’社会看起来完美,实际上有很多问题.最棘手的主要有这么两个,其一是某些业务较其他业务重要,需要在资源有 ...
- WlanGetAvailableNetworkList
原文msdn链接地址:https://docs.microsoft.com/zh-cn/windows/desktop/api/wlanapi/nf-wlanapi-wlangetavailablen ...
- 【bzoj4571】美味
Portal -->bzoj4571 Solution emmm持续智力康复.. 虽然说因为统计的是加上\(x\)的跟\(b\)异或的最大值所以可持久化trie用不了了 但是按位贪心的思想还 ...
- python基础----__slots__方法、__call__方法
''' 1.__slots__是什么:是一个类变量,变量值可以是列表,元祖,或者可迭代对象,也可以是一个字符串(意味着所有实例只有一个数据属性) 2.引子:使用点来访问属性本质就是在访问类或者对象的_ ...
- shell函数使用
函数定义格式: 和js有点类似,不过在 shell 中 function 关键字是可选的. 如: sum { // shell 语句 } function sum() { // shell 语句 } ...
- 分布式监控系统开发【day37】:监控数据如何存储(七)
一.如何存储 二.目录结构 三.代码调用逻辑关系 四.实现代码 1.data_optimization 1.存筛选出来符合条件的数据 def get_data_slice(self,lastest_d ...
- python---websocket的使用
一:简介 推文:WebSocket 是什么原理?为什么可以实现持久连接? 推文:WebSocket:5分钟从入门到精通(很好) WebSocket协议是基于TCP的一种新的协议.WebSocket最初 ...
- Java集合(4)一 红黑树、TreeMap与TreeSet(下)
目录 Java集合(1)一 集合框架 Java集合(2)一 ArrayList 与 LinkList Java集合(3)一 红黑树.TreeMap与TreeSet(上) Java集合(4)一 红黑树. ...
- 获取Session和request方法
action中的几种写法 //第一种很少用public class LoginAction1 extends ActionSupport { private Map request; ...
- 「LibreOJ β Round #4」多项式 (广义欧拉数论定理)
https://loj.ac/problem/525 题目描述 给定一个正整数 kkk,你需要寻找一个系数均为 0 到 k−1之间的非零多项式 f(x),满足对于任意整数 x 均有 f(x)modk= ...