一、CSS
-
transform:translate(50%,50%)中百分比是以自己的长宽作为基准。而top:50%；left:50%是相对于包含块的宽高。 - input元素无法添加
::before,::after伪元素。如果想添加必须套一层div - 针对元素的3d transform变换。火狐浏览器中父级元素必须设有一下属性：
.3d{
/*perspective 属性指定了观察者与z=0平面的距离，使具有三维位置变换的元素产生透视效果。*/
perspective:3000px;
transform-style:preserve-3d;
}
/*当然其实perspective也有另一种写法*/
.perspective2{
transform: perspective(600px) rotateY(45deg);
}
- input type="file" 有accept属性可以设定选择的文件类型
- text-indent只对block container有效（inline-block元素和block元素），对inline元素无效。（有机会应该查查inline-block的前世今生）
-
white-space:pre和white-space:pre-wrap的区别在于，pre-wrap遇到边框会自动换到下一行，pre默认就挤出去了 -
:nth-child和nth-of-type伪类都是匹配第几个元素，区别在于搜索范围不一样。nth-child搜索范围是所有兄弟元素。nth-of-type搜索范围是所有相同标签名的兄弟元素。 - text-align只对块状元素有效，对span这种inline元素无效。
- pre标签中的内容不会继承父标签的字体font-family，因为pre标签内置了
font-famliy:monospace -
-moz-element(#id)生成一个<image> 值，详情见element()
火狐中可以这么用background:-moz-element(#myBackground1)，目前只有火狐浏览器对其有实现。
二、HTML
- form表单不允许嵌套form元素，详见"<form> Permitted content"
- textarea 标签的内容需要 value 属性取得，不能用 innerHTML 和 innerText
三、JS
- revokeObjectURL和createObjectURL连用。经常容易忘记使用revokeObjectURL释放内存。
var img = docuemnt.createElement("img");
img.src = window.URL.createObjectURL(file);
img.onload = function() {
// 明确地释放之前创建的存在的 URL 对象。
window.URL.revokeObjectURL(this.src);
}
previewArea.appendChild(img);
四、冷门知识
关于原生Date的一些冷门知识 http://chitanda.me/2015/08/21/the-trivia-of-js-date-function/
