今天完成的事情~

额~朋友来找我大保健，今天水了

1.页面1完成了大概一半，学会了使用bootstrap制作轮播图和初步了解了栅格布局

今天的收获

1.bootstrap轮播插件

内容可以是图像，视频，内嵌框架等任何你想要放置的内容

使用规则：

给div添加myCarousel

<div id="myCarousel" "carousel slide">
    <!-- 轮播（Carousel）指标 -->
    <ol "carousel-indicators">
        <li data-target="#myCarousel" data-slide-to="0" "active"></li>
        <li data-target="#myCarousel" data-slide-to="1"></li>
        <li data-target="#myCarousel" data-slide-to="2"></li>
    </ol>
    <!-- 轮播（Carousel）项目 -->
    <div "carousel-inner">
        <div "item active">
            <img src="img/cm.jpg" alt="First slide">
        </div>
        <div "item">
            <img src="img/cm.jpg" alt="Second slide">
        </div>
        <div "item">
            <img src="img/cm.jpg" alt="Third slide">
        </div>
    </div>
    <!-- 轮播（Carousel）导航 -->
    <a "carousel-control left" href="#myCarousel"
       data-slide="prev"><span>&lsaquo;</span></a>
    <a "carousel-control right" href="#myCarousel"
       data-slide="next"><span>&rsaquo;</span></a>
</div>

2.栅格布局

bootstrap内置的一套响应式，移动设备优先的栅格系统，随着屏幕设备或视口尺寸的增加，系统最多分为12列，他是通过一系列的行row 与列column的组合创建页面布局，然后内容可以放入创建好的布局当中。

使用规则:

行row必须包含在容器container中，一边为其赋予合适的对齐方式和padding

<div class="container">
	<div class="row"></div>
</div>

使用container-fluid可以使container占据100%宽度

行row中可以添加列column，但列不可以超过平分的总列数，如

<div class="container">
<div class="row">
  <div class="col-md-4"></div>
  <div 

他们之间的关系container>row>column

col需要占多少列宽度时，用col-xx-xx表示，比如col-xs-2，表示在超小屏幕下占据2个列宽度

.col-xs-*
 ：超小屏幕、手机 (<768px)
.col-sm-*
 ：小屏幕 平板 (≥768px)
.col-md-*
 ：中等屏幕 桌面显示器 (≥992px)
.col-lg-*
 ：大屏幕 大桌面显示器 (≥1200px)

同时使用多个col-xx 组合拳可以达到不同宽度下的自适应

今天遇到的问题

1.bootstrap使用不够灵活，想调整效果比较困难~源码又都不太懂。。。

明天的计划

完成页面1+使用div制作出职业介绍页面的表格