经验面试
js 加载资源的优化;
1.js文件放在body底部;2,使用defer;3使用async ;异步加载;(记住异步加载的时候可能顺序会乱;) 4,脚本异步;
加载资源的优化;压缩文件;压缩图片;图片整合;
页面加载速度的优化;(首先要考虑到有什么css;js,html)
1使用cdn加载,缓存静态资源;2,代码优化;3.js,css合并压缩;4优化图片;5;减少带宽;
cookie 设置cookie会话的一个属性; expires;
浏览器标准模式和怪异模式之间的区别是什么?
盒模型不同;有什么不同; w3c标准盒子模型;margin paddng border content; content;不包含border;padding ;margin;而iecontent包含margin padding border;
用另一种方式表示;w3c 实际的width = width+padding+border+content 而 ie ;
让一个元素垂直水平居中的方法有哪些;
1, div{
position:absolute;
width:200px;
height:200px;
left:0;
right:0;
top:0;
bottom:0;
margin:auto;
background:pink;
}*/
2 /*div{
position:absolute;
width:200px;
height:200px;
background:pink;
left:50%;
top:50%;
margin-left:-100px;
margin-top:-100px;
}*/
3 div{
position:absolute;
width:200px;
height:200px;
background:pink;
left:50%;
top:50%;
transform: translate(-50%,-50%);
}
一个元素在另一个元素中垂直水平居中的方法有哪些;除了上面的方法除外;还有一个flex布局;就是四种
div {
width:500px;
height:500px;
background:pink;
display:flex;
justify-content:center;
align-items:center;
p{
width:100px;
height:100px;
background:green;
}
}
左右固定;中间自适应;
1,一个左浮动一个右边浮动; 中间用margin值撑开;
2;一个左浮动一个右浮动; 中间用定位position;也是用margin撑开;
3 利用flex布局;父元素display:flex; 让中间的flex:1;
中间固定;两边自适应;布局;
清理浮动的方法;
1.一个元素如果左边浮动受到了影响;哪个元素受到了影响;哪个元素清除浮动;
2.浮动元素的父元素后面加个空盒子;然后给空盒子清除浮动;
3.使用伪类的方法;和第二种原理一样;给伪类添加浮动;需要加content:‘.’;display:block;height:0;clear:both;
4,万能清除法 display:block; overflow:hidden;visiblity:hidden;height:0;content:'.'height:auto; zoom:1