前端日常总结

1.移动端meta常用设置

2.transform:rotate,skew,scale,translate,matrix使用详解
3.for(var i=0;...;...){}中的i和for本身在同一个作用域
4.inline,inline-block,block的区别:

inline无宽高无垂直方向的margin
inline-block相当于inline，但是有宽和高,相互之间有和字体大小有关的空隙(即父元素font-size:0可以去空隙)
block宽度默认100%,即使设置了宽度，默认也是占一行的空间

5.水平居中

1.text-align:center(inline,inline-block)
2.margin:auto 0(block,inline-block)
3.margin-left:50%(left:50%);-webkit-transform:translate(-50%,0)
4.flex

6.垂直居中

1.文字line-height设置为父元素height;
2.父div(display:table),子div(display:table-cell;vertical-align:middle);
3.或者同上(top:50%;-webkit-transform:translate(0,-50%))

6.5［水平垂直居中］
display:flex;
align-items:center;
justify-content:center;

7.获取当前日期

var myDate=new Date();
myDate.getFullYear()+"-"+(parseInt(myDate.getMonth())+1)+"-"+myDate.getDate()+" "+myDate.getHours()+":"+myDate.getMinutes()
+":"+myDate.getSeconds();//getMonth()是0-11

8.ajax执行完成的前后顺序和代码顺序不是必然关系，除非一个方法写在另外一个方法的success中
9.移动端touchmove的触发要设置event.preventDefault();
10.字符间距：

letter-spacing:..中文间距字符
word-spacing:..英文间距字符

11.iphone手机上数字可能默认是超链接，若想不是超链接可设置

12.position

position:static; /*默认值，忽略top,bottom,left,right,z-index*/
position:absolute; /*相对于static以外的第一个父元素进行定位*/
position:fixed;/*Fixed positioning is similar to absolute positioning, with the exception that the element's containing block is the viewport. */
position:relative;

13.元素的垂直方向的外边距存在合并的情况，具体见http://www.softwhy.com/forum.php?mod=viewthread&tid=4592,即相邻的两个或多个外边距在垂直方向合并成一个外边距，水平不存在。

外边距条件:
-相邻的外边距没有非空元素，padding和border和clear分隔
-对象都处在文档流中，即非浮动和pisition不为fixed和absolute的元素

14.页面滚动到元素位置

$('html, body').animate({scrollTop: $('#contact').offset().top -100 }, 'slow');

15.ajax和jsonp

ajax和jsonp本质上是不同的东西，ajax的核心是通过XmlHttpRequest获取非本页内容，而jsonp的核心则是动态添加