操作方法
- 01
先看下我们的html代码，就是一个简单的table，四行四列。
- 02
运行页面后，可以看到没有加上任何样式的table表格，是一个很丑陋的表格。
- 03
要利用Bootstrap美化table表格，首先我们要引入bootstrap样式文件，如图。
- 04
我们不用额外写自己的样式代码，只要在原来的html里为table添加一个‘table’的样式名就行了，如图，这个样式在bootstrap.css样式文件里是有定义的，是插件为我们定义的样式。所以我们自己不需要写任何一行样式代码，就可以美化table表格。
- 05
添加后，刷新页面看下效果。从图中可以看到，现在的table表格看起来整洁很多了。
- 06
我们还可以加上另外一个样式名，让表格的单元格显示分隔线。把代码里的 <table class="table">改成 <table class="table table-bordered">，效果如图
- 07
再加上table-striped的样式，可以让table有隔行的效果。如图
<table class="table table-bordered table-striped"> - 08
如果需要效果：在鼠标放到每一行时，该行显示不一样的背景色，那么我们可以加上样式名：table-hover。
<table class="table table-bordered table-hover">。 - End
