响应式布局demo遗留问题

1.float？

2.去除float效果？为什么有display：table？

浮动框旁边的行框被缩短，从而给浮动框留出空间，行框围绕浮动框。

因此，创建浮动框可以使文本围绕图像：

要想阻止行框围绕浮动框，需要对该框应用  clear 属性 。clear 属性的值可以是 left、right、both 或 none，它表示框的哪些边不应该挨着浮动框。

浮动的宗旨是，在不溢出包含块的情况下，尽量的靠上靠左/右放置，但是不能高于它前面生成的块框、浮动框和行框的顶。

3.normalize.css深入理解一下

使用方法：

1. 下载，本地项目使用
2. CDN资源link引入HTML页面

作用：

• 保留有用的默认值，不同于许多 CSS 的重置
• 标准化的样式，适用范围广的元素。
• 纠正错误和常见的浏览器的不一致性。
• 一些细微的改进，提高了易用性。
• 使用详细的注释来解释代码。 

Normalize.css到底有什么用

• 不同的浏览器在对于CSS没有定义的一些样式属性是不一样的，
• 比如没有在自己的CSS里面规定超链接有没有下划线的时候，有些浏览器有，有些浏览器没有；
• 再比如有一些浏览器规定的超链接默认颜色是蓝色，有一些又是黑色。
• 而这个CSS的功能就是对几乎所有的默认样式进行重置，让所有的浏览器上对于未定义的样式浏览效果达到一致
• （虽然说无法完全一致，但至少可以消除掉大部分差距）

4.-webkit-box-sizing?

设置了box-sizing为border-box后，容器的高宽就是实际容器的高宽，而不是单纯指的是内容区的大小。也可以理解为，这时候的高宽计算方式把padding和border大小也算进来了。

webkit是指box-sizing对不同浏览器兼容的意思，。-moz代表火狐的内核，-ms代表IE内核，-webkit代表webkit内核，常见是的是 谷歌 和苹果浏览器

5.响应式布局工具深入理解一下

暂时不知道怎么处理