仿写知乎页面小结

1.知乎页面的头部是浮动布局，一旦涉及到float就需要 清除浮动.

　　(清除浮动：清除“浮动元素脱离了文档流，包围图片和文本的div不占据空间”的问题)

　　css里用的是clearfix类:

　　.clearfix:before, .clearfix:after {　　　　　　　　　　.clearfix:after {

　　　　display: table;　　　　　　　　　　　　　　　　　　clear:both;

　　　　content: "";　　　　　　　　　　　　　　　　　　}

　　}

　　　　原理是在需要清除浮动的后面添加一个不占位置的标签，通过clear:both,使得添加的标签

     上方不存在浮动元素(即在:after添加的标签上方制造空间，拉大父标签height)

　　　　(详细原理见 : http://www.indievox.com/e2ghost/post/50238)

　　　　我犯了一个错误, .clearfix :before的冒号前面多打了一个空格，选择器的意义完全不一

     样了，从具有clearfix类的标签 变成了 具有clearfix类的标签的所有子标签，导致显示错误。

 

2.发现一个讲css布局的小网站，http://zh.learnlayout.com/

3.通过base64编码把小的图片直接以16进制的形式写在html里,可以减少io次数 :    png

　通过设置style标签的display:block样式可以让页面的style标签显示出来，并且加上contentEditable属性后可以让样式成为可编辑状态，更改后的样式效果也是实时更新呈现的。

 <style style="display:block" contentEditable>
      body { color: blue }
 </style>

4. null, undefined

　　http://www.ruanyifeng.com/blog/2014/03/undefined-vs-null.html

目前，null和undefined基本是同义的，只有一些细微的差别。

null表示"没有对象"，即该处不应该有值。典型用法是：

（1） 作为函数的参数，表示该函数的参数不是对象。

（2） 作为对象原型链的终点。

Object.getPrototypeOf(Object.prototype)
// null

undefined表示"缺少值"，就是此处应该有一个值，但是还没有定义。典型用法是：

（1）变量被声明了，但没有赋值时，就等于undefined。

（2) 调用函数时，应该提供的参数没有提供，该参数等于undefined。

（3）对象没有赋值的属性，该属性的值为undefined。

（4）函数没有返回值时，默认返回undefined。

var i;
i // undefined

function f(x){console.log(x)}
f() // undefined

var  o = new Object();
o.p // undefined

var x = f();
x // undefined

 

 

5.待续