前端开发经典面试题及答案CSS篇

中科爱心救助 https://baike.baidu.com/item/%E5%88%98%E4%BA%91%E6%B6%9B/21900249?fr=aladdin

前端开发经典面试题及答案——CSS篇

一、CSS选择器的优先级排序,怎么计算权值?

二、display:none和visibility:hidden的区别

三、CSS的引用方式有哪些?它们的区别?

四、CSS有哪些选择符?可继承的属性有哪些?

CSS选择符:

可继承和不可继承的属性:

五、fixed和absolute的区别?

六、如何实现水平、垂直居中?

1、利用定位+margin:auto

2、利用定位+margin:负值

3、利用定位+transform

4、table布局

5、flex布局

6、gird布局

七、如何实现左侧边栏固定,其他内容自适应?

1、左侧固定宽度,右侧flex自适应flex:1,占据剩余空间;

2、左侧固定宽度,右侧flex自适应flex:1,占据剩余空间;

3、左侧固定宽度左浮动,右侧设margin-left等于左侧宽度;

4、左侧固定宽度、固定定位,右侧宽度%;

5、左侧宽度固定、固定定位,右侧左边距等于左侧宽度;

6、双左浮动,右侧计算属性计算宽度;

7、左侧左浮,右侧右浮动,右侧计算宽度;

8、左侧固定宽度,display:inline-block,右侧右浮动,计算宽度。

八、css3的新特性

1、CSS3新特性之选择器

2、CSS3新特性之样式

3、CSS3新特性之transition过渡

4、CSS3新特性之transform转换

5、CSS3新特性之animation动画

6、CSS3新特性之渐变

九、了解过哪些页面布局?

十、Sass写一个数组?

十一、什么时候用less

1、函数式编程css

2、自定义变量用于整体主题调整

3、嵌套语法简化开发复杂度

4、页面层级结构多,重复使用的css代码较多时

十二、animation和transition

十三、盒子模型概念

十四、px、em、rem、%、vm、vh

十五、display的值和作用

十六、列举两种清除浮动的方法

1、父元素添加overflow:hidden

??通过触发BFC方式,实现清除浮动

??优点:代码简洁

??缺点:内容增多的时候容易造成不会自动换行导致内容被隐藏掉,无法显示要溢出的元素。

2、使用after伪元素清除浮动

??优点:符合闭合浮动思想,结构语义化正确。

??缺点:ie6-7不支持伪元素:after,使用zoom:1触发hasLayout。

以上就是霸哥今日整理的前端经典面试题及答案CSS篇,如有疑问,欢迎私信霸哥!




转载请注明:http://www.aierlanlan.com/rzfs/7549.html