前端—每天5道面试题(十三)
前端—每天5道面试题(十三)
一、display:none;和visibilty:hidden ;和opacity:0;和overflow:hidden的区别?
display:none;隐藏自己,隐藏后不占据位置
visibilty:hidden;隐藏位置,隐藏后原位置保留
opacity:0;隐藏位置,隐藏后位置保留
overflow:hidden;溢出部分隐藏
二、CSS中,自适应的单位都有哪些?
- 百分比:%
- 相对于视口宽度的单位:vw
- 相对于视口高度的单位:vh
- 相对于视口宽度或者高度(取决于哪个小)的单位: vm
- 相对于父元素字体大小的单位:em
- 相对于根元素字体大小的单位:rem
三、什么是外边距重叠?重叠的结果是什么?
外边距重叠就是 margin- collapse在CSS中,相邻的两个盒子(可能是兄弟关系也可能是祖先关系)的外边距可以结合成一个单独的外边距。这种合并外边距的方式称为折叠,因此而结合成的外边距称为折叠外边距,折叠结果遵循下列计算规则。
(1)当两个相邻的外边距都是正数时,折叠的结果是它们两者中较大的值
(2)当两个相邻的外边距都是负数时,折叠的结果是两者中绝对值较大的值。
(3)当两个外边距一正一负时,折叠的结果是两者相加的和。
四、访问超链接后 hover样式就不出现的原因是什么?应该如何解决?
因为访问过的超链接样式覆盖了原有的 hover和 active伪类选择器样式,解决方法是将CSS属性的排列顺序改为L→V→H→A(link, visited, hover, active)。
五、在书写高效CSS时有哪些问题需要考虑?
(1)样式,从右向左解析一个选择器
(2)类型选择器的速度,ID选择器最快, Universal(通配符*)最慢。对于常用的4种类型选择器,解析速度由快到慢依次是ID、 class, tag和 universal。
(3)不要用标签限制ID选择器(如:ul#main- navigation{}
,ID已经是唯一的,不需要Tag来限制,这样做会让选择器变慢)。
(4)后代选择器最糟糕(换句话说, html body ul li a{}
这个选择器是很低效的)。
(5)想清楚你的需求,再去书写选择器。
(6)CSS3选择器(如nth- child)能够漂亮地定位我们想要的元素,又能保证CSS整洁易读。然而,这些神奇的选择器会浪费很多的浏览器资源。
(7)我们知道ID选择器的速度最快,但是如果都用ID选择器,会降低代码的可读性和可维护性等。在大型项目中,相对于使用ID选择器提升速度,代码的可读性和可维护性带来的收益更大。
前端—每天5道面试题(十三)相关推荐
- 前端—每天5道面试题(十二)
前端-每天5道面试题(十二) 每天进步1% 不多 就1% 一.CSS3 新特性有哪些 1.颜色:新增 RGBA,HSLA 模式 2. 文字阴影(text-shadow.) 3.边框: 圆角(borde ...
- 前端—每天5道面试题(十一)
前端-每天5道面试题(十一) 每天进步1% 不多 就1% 一.简述对 Web 语义化的理解? 就是让浏览器更好的读懂你写的代码,在进行 HTML 结构.表现.行为设计时,尽量使用语义化的标签,使程序代 ...
- 前端—每天5道面试题(十)
前端-每天5道面试题(十) 每天进步1% 不多 就1% 一.用 div+css 布局的好处? 表现和内容相分离 将设计部分剥离出来放在一个独立样式文件中,HTML 文件中只存放文本信息. 提高搜索引擎 ...
- 前端—每天5道面试题(九)
前端-每天5道面试题(九) 每天进步1% 不多 就1% 一.overflow 有哪些属性值? Visible:默认值,内容不会被修剪,会呈现在元素框之外. Hidden:内容会被修剪,并且其余内容是不 ...
- 前端—每天5道面试题(8)
前端-每天5道面试题(8) 每天背5道前端面试题,你会越来越优秀 1.console.log 是同步还是异步? 如何实现 一个 console.log? console.log 内部实现的是 proc ...
- 前端—每天5道面试题(7)
前端-每天5道面试题(7) 每天背5道前端面试题,你会越来越优秀 1.webpack 中 loader 和 plugin 的区别是什么? loader:loader 是一个转换器,将 A 文件进行编译 ...
- 前端—每天5道面试题(6)
前端-每天5道面试题(6) 每天背5道前端面试题,希望我可以在远方的终点见到你 1.谈谈JS 异步解决方案的发展历程以及优缺点. 1.回调函数(callback) 优点:解决了同步的问题(只要有一个任 ...
- 前端—每天5道面试题(5)
前端-每天5道面试题(5) 每天背5道前端面试题,希望我可以在远方的终点见到你 1.简述一下前端的性能优化问题 (一).页面内容方面 通过文件合并.css 雪碧图.使用 base64 等方式来减少 H ...
- 前端—每天5道面试题(4)
前端-每天5道面试题(4) 每天背5道前端面试题,希望我可以在远方的终点见到你 1.写 React / Vue 项目时为什么要在列表组件中写 key, 其作用是什么? key 是给每一个 vnode ...
最新文章
- Jquery元素判断是否存在
- [转] javaweb学习-jstl-c:forEach中 varStatus的属性简介
- Android5.1设备无法识别exFAT文件系统的64G TF卡问题
- url特殊字符转义及解决方法
- MVC5中EF6 Code First启动慢及间隙变慢的一些优化处理
- html编辑四则运算,简单的web四则运算计算器
- 【Transformer】PoolFormer: MetaFormer is Actually What You Need for Vision
- vue animation css实现左右折叠面板
- python处理实例_python处理xml实例
- 2015英特尔® 实感™ (Intel® RealSense™) 动手开发实验课
- python-多线程共享内存
- pyc文件反编译成py文件
- base64图片的String字符串压缩变小
- 微信开发:账号申请,AppID、AppSecret 获取方式
- 牛顿莱布尼茨计算机公式,牛顿莱布尼茨公式
- 《界面风格设计说明书》
- HTML个人网站设计(源码)
- 电脑鼠标左键按下去没反应怎么办
- 使用 CSS 追踪用户
- 谈一谈|在win10家庭版上用虚拟机安装docker