问题:块级元素平居中的法?
解析:如果使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相关的习题,若有所疏漏欢迎指正。