今日完成：完成任务6

下一步计划：完成任务7

遇到的问题：

         flex布局和white-space: nowrap;相冲突

         解决办法：网上查资料是因为设置宽度，它会无限增加宽度导致超出屏幕外，可是这个宽度是动态的，所以就合理应用flex属性和加上min-width就ok了。如果不行就换另一种思路，所以我换了另一种写法。

今天的收获:

         1、title与h1、b与strong、i与em、img的alt与title、src与href有什么区别？

         title与h1的区别: 

              title是网站标题概括的是网站信息，显示在网页Tab栏里的。

              h1是文章主题，更直观的面向用户，是显示在网页中的。

         b与strong,i与em的区别: 

              前者是实体标签，后者是逻辑标签。

             从视觉上效果观看b与strong、i与em是没有区别,但是搜索引擎检索的时候搜索引擎可以识别strong、em标签、而不能识别b与i标签。

           （后者从用户角度来说也方便了盲人阅读）

             建议为了符合现在的W3C规范，b应尽量少用而改用strong ,i应尽量少用而改用em

         img中的alt与title属性区别: 

             alt属性是图片不能加载时在页面显示的提示信息，它会直接输出在原本加载图片的地方

             title属性是在你鼠标悬停在该图片上时显示一个小提示。

         src与href的区别: 

             href是超文本引用，指向需要连结的地方，是引用。在 link和a 等元素上使用。 

             src是指向物件的来源地址，是引入。在 img、script、iframe 等元素上使用。 

       2、去除inline-block元素间间距的N种方法

          (1)移除标签间的空格

          (2)使用margin负值

          (3)不加闭合标签

          (4)使用font-size:0

          (5)使用letter-spacing

          (6)使用word-spacing

          (7)更多参考https://www.zhangxinxu.com/wordpress/2012/04/inline-block-space-remove-%E5%8E%BB%E9%99%A4%E9%97%B4%E8%B7%9D/

       3、雪碧图（精灵图）CSS Sprite

           就是很多张小图合并为同一张，然后通过css的背景定位（background：position(x,y);）来显示需要显示的图片部分。

           对内存和带宽更好，并且可以减小图片的总大小。

           制作雪碧图网站：https://www.toptal.com/developers/css/sprite-generator/

      4、css有哪些属性可以继承？

           font-family、font-weight、font-size、font-style、 text-align、line-height、 color、visibility等等

          详细参考：https://www.cnblogs.com/hoyong/articles/10690119.html

      5、学习到了github如何浏览静态网页（感谢师兄的帮助）