前端笔记---1
1.bootstrap表格样式：
①代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="bootstrap-3.3.7-dist/css/bootstrap.min.css">
</head>
<body>
<!--table-bordered table-hover table-striped-->
<table class="table ">
<thead>
<tr>
<th>姓名</th>
<th>年龄</th>
</tr>
</thead>
<tbody>
<tr>
<td>雪飞</td>
<td>16</td>
</tr>
<tr>
<td>得港</td>
<td>19</td>
</tr>
<tr>
<td>大壮</td>
<td>48</td>
</tr>
</tbody>
</table>
</body>
</html>
②显示结果图如下
③常用属性
<table class="table table-bordered table-hover table-striped">
table：表格
table-bordered：加边框
table-hover：选中某行背景颜色加灰
table-striped：隔行加灰
④用cdn引入
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css">
2.布局容器：
①两边留白
<style>
.cc{
background-color: red;
height: 200px;
}
</style>
<div class="container cc">
</div>
②布满全屏
<style>
.cc{
background-color: red;
height: 200px;
}
</style>
<div class="container-fluid cc">
</div>
3.栅格系统：
<div class="col-xs-2 c2">
自动适应屏幕：col-xs-x
<div class="col-md-2 c2 col-md-offset-5">
右偏移：col-md-offset-x
4.排版：
①引用bootstrap后
标签
