Web开发

首页 » 常识 » 常识 » 2020Web前端工程师面试常见问题及答
TUhjnbcbe - 2024/7/28 17:30:00
Web前端常见面试题

问题:块级元素平居中的法?

解析:如果使Hack的话,平居中的法常多,我们只介绍主流的

margin:0auto法

.center{

height:px;

width:px;

margin:0auto;

border:1pxsolidred;

}

divclass=center平居中/div

flex布局,前主流法

.center{

display:flex;

justify-content:center;

}

divclass=center

divclass=flex-div1/div

divclass=flex-div2/div

/div

table法

.center{

display:table;

margin:0auto;

border:1pxsolidred;

}

divclass=center平居中/div

还有些通过position+(margin

transform)等法的不样列举了,重点没必要。

问题:em\px\rem区别?

解析:px:绝对单位,按精确像素展示。

em:相对单位,基准点为节点字体的,如果身定义了font-size按身来计算(浏览器默认字体是16px),整个内1em不是个固定的值。

rem:相对单位,可理解为”rootem”,相对根节点html的字体来计算,CSS3新加属性,chrome/firefox/IE9+持。

问题:有哪些式(CSS)可以隐藏元素?

解析:opacity:0:本质上是将元素的透明度将为0,就看起来隐藏了,但是依然占据空间且可以交互;

visibility:hidden:与上个法类似的效果,占据空间,但是不可以交互了;

overflow:hidden:这个只隐藏元素溢出的部分,但是占据空间且不可交互;

display:none:这个是彻底隐藏了元素,元素从档流中消失,既不占据空间也不交互,也不影响布局;

z-index:-:原理是将层级放到底部,这样就被覆盖了,看起来隐藏了;

transform:scale(0,0):平变换,将元素缩放为0,但是依然占据空间,但不可交互;

还有些靠绝对定位把元素移到可视区域外,或者clip-path进裁剪的操作过于Hack,就不提了。

以上就是小科今天整理提供的Web前端开发面试题,希望为Web前端同学提供了有用的面试素材,以后小科每日均会提供Python及Web相关的习题,若有所疏漏欢迎指正。

1
查看完整版本: 2020Web前端工程师面试常见问题及答