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风格的表格的设计,并且提供了很多表格的基础和进阶的功能,给我们开发前端的表格省下很多力气. 本文主要参考这位博主的系列文章 ...
随机推荐
- Android 解决ScrollView嵌入ListView | GridView | ScrollView显示问题
一.ScrollView中嵌套ListView ScrollView和ListView都是滚动结构,很明显如果在ScrollView中加入ListView,可以预见性的知道,肯定会有显示/滚动的问题, ...
- 基于三个kinect的人体建模
单个kinect的人体重建,在Kinect SDK 1.8中,Kinect Fusion的效果已经很不错了.其缺点显而易见,一是扫描时间长,重建对象也需要长时间保持静态:二是需要人体或者kine ...
- Unity3D for VR 学习(6): 再次温故知新-3D数学
一年前,系统学习过3D数学,并记录了一篇博客<C#程序员整理的Unity 3D笔记(十):Unity3D的位移.旋转的3D数学模型>. 一年后,再次温习之. 坐标系:Unity3D使用左手 ...
- 使用Hexo写博客
首先,你需要搭建一个Hexo博客网站- 使用Hexo搭建GitHub博客(2018年Mac版) 原生方式新建文章 Hexo的项目结构是在网站根目录的source/_posts目录下存放你的博客文档,以 ...
- 在VS2010中使用Git【图文】
http://blog.csdn.net/laogong5i0/article/details/10974285 在之前的一片博客<Windows 下使用Git管理Github项目>中简单 ...
- Myeclipse下更改所有jsp、html文件的编码
windows-->>preferences-->>gengral-->>
- PostgreSQL 传统 hash 分区方法和性能
背景 除了传统的基于trigger和rule的分区,PostgreSQL 10开始已经内置了分区功能(目前仅支持list和range),使用pg_pathman则支持hash分区. 从性能角度,目前最 ...
- (转)ARC指南 - strong、weak指针
一.简介 ARC是自iOS 5之后增加的新特性,完全消除了手动管理内存的烦琐,编译器会自动在适当的地方插入适当的retain.release.autorelease语句.你不再需要担心内存管理,因为编 ...
- C++类间转换之dynamic_cast
当在C++的基类与派生类之间转换时,其多态性充分显现出来: 本次只讨论 dynamic_cast 的用法. 在查阅资料后发现百度百科关于 dynamic_cast (以及static_cast ...
- VMware 与Ubuntu通过samba服务器共享文件
Linux和windows在虚拟机下文件共享有很多种方式,常用的有使用VMware Tools共享和Samba服务器进行共享,使用VMware Tools这里就不说了,我使用的是Samba服务器. 其 ...