您所在位置:主页 > 上元IT >

上元IT-Web前端全栈开发企业笔试集锦(CSS下篇)

2020-03-26 21:35 颜丽 18051934329
上元IT-Web前端全栈开发企业笔试集锦(CSS下篇)
1、CSS选择器有哪些 
1、元素选择器
2、类选择器
3、ID选择器
4、属性选择器
5、派生选择器(后代选择器、子元素选择器、相邻兄弟选择器)
6、伪类选择器
 
2、请写出Flexbox中使元素水平垂直居中的CSS代码。
 
  .container{
display: flex;
display: -webkit-flex; //Safari仍旧需要使用特定的浏览器前缀
justify-content:center;(水平居中)
align-items: center;(垂直居中)
}
3、CSS的盒模型是?
  CSS盒模型又称框模型 (Box Model) ,包含了元素内容(content)、内边距(padding)、边框(border)、外边距(margin)几个要素
 
页面就是由一个个盒模型堆砌起来的
 
4、如何使用伪类清除CSS浮动?
 .fix:after {
    content:"";
    display:block;
    height:0;
    visibility:hidden;
    clear:both;
}
 
5、px、em、rem、vw/vh的区别是?
1 、px
px就是pixel(像素)的缩写,相对长度单位,相对于屏幕分辨率
 
2、em
参考物是父元素的font-size,具有继承的特点。浏览器默认字体是16px,整个页面内1em不是一个固定的值
 
字体大小同样都是1.5em,但是效果却截然不同,按照W3C提供的公式,我们可以计算下: class为id1的div字体大小继承自父元素body:16px*1.5em = 24px class为id2的div字体大小继承自父元素id1:24px*1.5em = 36px class为id3的div字体大小继承自父元素id2:36px*1.5em = 54px
 
3、rem
rem是CSS3新增的一个相对单位,但相对的只是HTML根元素。通过它既可以做到只修改根元素就成比例地调整所有字体大小,又可以避免字体大小逐层复合的连锁反应
  
5、vh和vw
vh和vw相对于视口的高度和宽度,1vh等于1/100的视口高度,1vw 等于1/100的视口宽度 比如:浏览器高度900px,宽度为750px, 1vh = 900px/100 = 9 px,1vw = 750px/100 = 7.5 px,很容易实现与同屏幕等高的框
 

上一篇:IT行业人才缺口近百万

下一篇:没有了