今天完成的事情：

1.

今天完成的事情：

1.完成了任务八。

2.display: none;、visibility: hidden、opacity=0区别总结

display: none;

1、浏览器不会生成属性为display: none;的元素。 
2、display: none;不占据空间（毕竟都不渲染啦），所以动态改变此属性时会引起重排。 
3、display: none;不会被子类继承，但是···子类是不会显示的，毕竟都一起被kill啦。 
4、display,是个尴尬的属性，transition对她无效。(毫无争议)

visibility: hidden;

1、元素会被隐藏，但是不会消失，依然占据空间。 
2、visibility: hidden会被子类继承，子类也可以通过显示的设置visibility: visible;来反隐藏。 
3、visibility: hidden;不会触发该元素已经绑定的事件。 
4、visibility: hidden;动态修改此属性会引起重绘。 
5、visibility,transition对她无效。(亲测)

opacity=0

1、opacity=0只是透明度为100%,元素隐藏，依然占据空间。 
2、opacity=0会被子元素继承,且，子元素并不能通过opacity=1，进行反隐藏。不能。 
3、opacity=0的元素依然能触发已经绑定的事件。 
4、opacity,transition对她有效(毫无争议)

明天的计划：

1.学习任务十

2.深度思考如何实现轮播图？

3.如何用css写一个简单的幻灯片效果页面？

遇到的问题：

1.在实现图片转动的时候，设置了display：none;没有起到作用，后来和师兄学习中才了解到了

display:none中区别，

     1、浏览器不会生成属性为display: none;的元素。 

     2、display: none;不占据空间（毕竟都不渲染啦），所以动态改变此属性时会引起重排。 
      3、display: none;不会被子类继承，但是···子类是不会显示的，毕竟都一起被kill啦。 
      4、display,是个尴尬的属性，transition对她无效。(毫无争议)

收获：

1.完成了任务八。

2.学习了

display: none;、visibility: hidden、opacity=0区别总结

display: none;

1、浏览器不会生成属性为display: none;的元素。 
2、display: none;不占据空间（毕竟都不渲染啦），所以动态改变此属性时会引起重排。 
3、display: none;不会被子类继承，但是···子类是不会显示的，毕竟都一起被kill啦。 
4、display,是个尴尬的属性，transition对她无效。(毫无争议)

visibility: hidden;

1、元素会被隐藏，但是不会消失，依然占据空间。 
2、visibility: hidden会被子类继承，子类也可以通过显示的设置visibility: visible;来反隐藏。 
3、visibility: hidden;不会触发该元素已经绑定的事件。 
4、visibility: hidden;动态修改此属性会引起重绘。 
5、visibility,transition对她无效。(亲测)

opacity=0

1、opacity=0只是透明度为100%,元素隐藏，依然占据空间。 
2、opacity=0会被子元素继承,且，子元素并不能通过opacity=1，进行反隐藏。不能。 
3、opacity=0的元素依然能触发已经绑定的事件。 
4、opacity,transition对她有效(毫无争议)