html+css基础题

运用CSS3动画需要用到什么规则?

html+css基础题
要运用css3动画,需要运用@keyframes规则animation属性

display: none和visibility:hidden的区别

html+css基础题

display: none和visibility:hidden的区别是visibility:hidden会保留元素的空间

repaint(重绘) ,repaint发生更改时,元素的外观被改变,且在没有改变布局的情况下发生,如改变outline,visibility,background color,不会影响到dom结构渲染。

reflow(渲染),与repaint区别就是他会影响到dom的结构渲染,同时他会触发repaint,他会改变他本身与所有父辈元素(祖先),这种开销是非常昂贵的,导致性能下降是必然的,页面元素越多效果越明显。

display:none改变了dom的结构,所以产生了reflow visibility:hidden没有改变dom结构,触发repaint

所以display:none才会产生reflow

visibility:hidden只会出发repaint

iframe应用场景

html+css基础题

iframe可用在以下几个场景中:

1:典型系统结构,左侧是功能树,右侧就是一些常见的table或者表单之类的。为了每一个功能,单独分离出来,采用iframe。
2:ajax上传文件。
3:加载别的网站内容,例如google广告,网站流量分析。
4: 在上传图片时,不用flash实现无刷新。
5: 跨域访问的时候可以用到iframe,使用iframe请求不同域名下的资源。