今天完成的事情：

1.继续css任务5

2.了解overflow

3.学习弹性盒子

4.学习《CSS代码规范》

明天计划的事情：

1.完成css任务5

2.学习前几个任务的思考题

遇到的问题：

暂无

收获：

1.css 布局的几种方式

      CSS 的布局应该是 CSS 体系中的重中之重了，主要的布局方式有 table 表格布局（早期），float 浮动布局和 flex 布局，还有针对于移动端的响应式布局。

  1）table 布局

       table 的特性决定了它非常适合用来做布局，并且表格中的内容可以自动居中，这是之前用的特别多的一种布局方式。

       但是它也有自身的局限性，比如 table 比其它 html 标记占更多的字节（造成下载时间延迟,占用服务器更多流量资源），table 会阻挡浏览器渲染引擎的渲染顺序。(会延迟页面的生成速度,让用户等待更久的时间)，但是某些情况下，当采用其他方式不能很好的达到自己的效果时，采用 table 布局能适应当前场景。

       2）flex布局

       flexbox 布局即弹性盒子布局，它的特点是盒子本来就是并列的，只需要指定宽度。

      但是 flexbox 布局方式浏览器的支持不是太好，有一些兼容性的问题，但是是未来布局的趋势。

    3）float 布局

    4）响应式布局

         <meta name="viewport" content="width=device-width, initial-scale=1">

           width = device-width 这一句的意思是让页面的宽度等于屏幕的宽度。

2.块级元素和行内元素

   行内元素和块级元素的区别：

    行内元素：　　

• 与其他行内元素并排
• 不能设置宽高，默认的宽度就是文字的宽度

    块级元素：

• 霸占一行，不能与其他任何元素并列。
• 能接受宽高，如果不设置宽度，那么宽度将默认变为父级的100%。

  块级元素和行内元素的分类：

　　在HTML的角度来讲，标签分为：

　　　　文本级标签：p , span , a , b , i , u , em

　　　　容器级标签：div , h系列 , li , dt ,dd

　　　　p：里面只能放文字和图片和表单元素，p里面不能放h和ul，也不能放p。

　 　从CSS的角度讲，CSS的分类和上面的很像，就p不一样：

　　　　行内元素：除了p之外，所有的文本级标签，都是行内元素。p是个文本级标签，但是是个块级元素。

　　　　块级元素：所有的容器级标签，都是块级元素，以及p标签。