2020年css3面试题有哪些

  

2020 css3面试题有哪些?很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。

<强> 1。盒模型

·在CSS3中:表示伪类,::表示伪元素·想让插入的内容出现在其他内容前,使用::befroe。否,则使用::在

<强> 4。CSS中哪些属性可以继承?

·每一个属性在定义中都给出了这个属性是否具有继承性,一个具有继承性的属性会在没有指定值的时候,会使用父元素的同属性的值   来作为自己的值。   ·一般具有继承性的属性有,字体相关的属性,字体大小和粗细等。   ·文本相关的属性,颜色和text-align等。   ·表格的一些布局属性,列表属性如list-style等。   游标·还有光标属性,元素可见性可见性。   ·当一个属性不是继承属性的时候,我们也可以通过将它的值设置为继承来使它从父元素那获取同名的属性值来继承。

<强> 5。如何居中p

——水平居中1:给p设置一个宽度,然后添加保证金:0汽车;属性

p {   宽度:200 px;   保证金:0汽车;}

-水平居中2:利用text-align:中心实现

.container {   背景:rgba (0, 0, 0, 0。5);   text-align:中心:   字体大小:0;}.box {   显示:inline-block;   宽度:500 px;   身高:400 px;   背景颜色:粉色;}

——让绝对定位的p居中

p {   positionn:绝对;   宽度:300 px;   身高:300 px;   保证金:汽车;   上图:0;   左:0;   底部:0;   右:0;   背景颜色:粉色;/*方便看效果*/}

-水平垂直居中1

/*确定容器的宽高,宽500高300 */p {
  位置:绝对的;
  宽度:500 px;
  身高:300 px;
  上图:50%;
  左:50%;
  保证金:-150 px 0 0 -250 px;
  背景颜色:粉色;}

-水平垂直居中2

/*未知容器宽高,利用变换属性*/p {
  位置:绝对的;
  宽度:500 px;
  身高:300 px;
  上图:50%;
  左:50%;
  变换:翻译(-50%,-50%);
  背景颜色:粉色;}

-水平垂直居中3

/*利用flex布局实际使用时应考虑兼容性*/.container {
  显示:flex;
  对齐项目:中心;/*垂直居中*/justify-content:中心;/*水平居中*/}。容器p {
  宽度:100 px;
  身高:100 px;
  背景颜色:粉色;}

<强> 6。CSS3有哪些新特性

·新增各种css选择器(:不是(.input)所不有类是“输入”的节点)·圆角(border - radius: 8 px;)·多列布局(multi-columnlayout)·阴影和反射(阴影/反映)·文字特效(文本阴影)·文字渲染(文字修饰)·线性渐变(梯度)·旋转(变换)·缩放,定位,倾斜,动画,多背景

<强> 7。解释一下Flexbox(弹性盒布局模型)?及适用场景吗?

2020年css3面试题有哪些