今天完成的事情：

今天开了周会做了自我评价，自我批评，看了一下框架，css语言规范，以及伪类选择器，权重问题，还有轮播图，今天看的东西很多，并没有记得很清楚，准备明天写代码时，多用，多试验一下。

明天计划的事情：

任务8的准备工作已经做好了，框架也引过来了，明天就是先把需要的图片，切过来然后先做一下导航栏，在用轮播图做页。

遇到的问题：

框架与轮播图，百度了很多才大概了解，是什么意思轮播图的话，可以自己做，很麻烦

1. 将所有需要轮播的图片横向并排排列，定位设置为绝对定位，暂定为pic-list。设置一个轮播图box,暂定为lb-box，lb-box依每张图片的宽高设置宽高，并将over-flow设置为hidden。将pic-list放到lb-box里，现在应该看到的是一张图片，设置一个定时器，每三秒或几秒执行一次，执行事件是将pic-list的left属性每次减去一张图片的宽度，到减完pic-list的宽度后，将left设置为0，轮播图完成。

2. 第二种思路，设置一个放置轮播图的box，定为lb-box，宽高一样为一张图片的宽高，将所有的轮播图名字命名为统一格式，比如（pic-1.png,pic-2.png,pic-3.png）。lb-box里放轮播图种的第一张图如（pic-1.png），设置一个定时器，每三秒或几秒执行一次，执行的事件是将轮播图的src属性改成pic-2.png(具体可设置一个变量进行++操作)。到最后一个轮播图再将轮播图src属性设置为pic-1.png。轮播图完成

PS.自己动手，丰衣足食。

还有就是可以去找百度上面的分享

<div id="myCarousel" class="carousel slide">
    <!-- 轮播（Carousel）指标 -->
    <ol class="carousel-indicators">
        <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
        <li data-target="#myCarousel" data-slide-to="1"></li>
        <li data-target="#myCarousel" data-slide-to="2"></li>
    </ol>
    <!-- 轮播（Carousel）项目 -->
    <div class="carousel-inner">
        <div class="item active">
            <img src="/wp-content/uploads/2014/07/slide1.png" alt="First slide">
        </div>
        <div class="item">
            <img src="/wp-content/uploads/2014/07/slide2.png" alt="Second slide">
        </div>
        <div class="item">
            <img src="/wp-content/uploads/2014/07/slide3.png" alt="Third slide">
        </div>
    </div>
    <!-- 轮播（Carousel）导航 -->
    <a class="carousel-control left" href="#myCarousel"
       data-slide="prev"> <span _ngcontent-c3="" aria-hidden="true" class="glyphicon glyphicon-chevron-right"></span></a>
    <a class="carousel-control right" href="#myCarousel"
       data-slide="next">&rsaquo;</a>
</div>

然后自己在调整样式，把图片的相对路径改了，要不然不会显示的，因为上面的图片是他本地的不是你的，所以要引自己本地的图片，然后在改一下。因为Bootstrap是免费·分享出来的，所以都可以用。

收获：

今天看了

Bootstrap

又仔细看了一下伪类选择器说一下我对伪类选择器的理解，

.demo a:link {color:gray;}/*链接没有被访问时前景色为灰色*/ .demo a:visited{color:yellow;}/*链接被访问过后前景色为黄色*/ .demo a:hover{color:green;}/*鼠标悬浮在链接上时前景色为绿色*/ .demo a:active{color:blue;}/*鼠标点中激活链接那一下前景色为蓝色

Link--visited--hover--active

他们4个要遵守这个顺序，来写出来，要不然就会出现bug或者，不显示。

• :hover用于当用户把鼠标移动到元素上面时的效果；
• :active用于用户点击元素那一下的效果（正发生在点的那一下，松开鼠标左键此动作也就完成了）
• :focus用于元素成为焦点，这个经常用在表单元素上。
• 
  
• 还有我在百度上面借鉴的
• 
  
• 1. :first-child选择某个元素的第一个子元素；
     
  2. :last-child选择某个元素的最后一个子元素；
     
  3. :nth-child()选择某个元素的一个或多个特定的子元素；
     
  4. :nth-last-child()选择某个元素的一个或多个特定的子元素，从这个元素的最后一个子元素开始算；
     
  5. :nth-of-type()选择指定的元素；
     
  6. :nth-last-of-type()选择指定的元素，从元素的最后一个开始计算；
     
  7. :first-of-type选择一个上级元素下的第一个同类子元素；
     
  8. :last-of-type选择一个上级元素的最后一个同类子元素；
     
  9. :only-child选择的元素是它的父元素的唯一一个了元素；
     
  10. :only-of-type选择一个元素是它的上级元素的唯一一个相同类型的子元素；
      
  用这种方式来选择的话，就不会出现因为命名太多，混乱的问题。