前端—每天5道面试题(十二)
前端—每天5道面试题(十二)
每天进步1% 不多 就1%
一、CSS3 新特性有哪些
1.颜色:新增 RGBA,HSLA 模式
2. 文字阴影(text-shadow、)
3.边框: 圆角(border-radius)边框阴影: box-shadow
4. 盒子模型:box-sizing
5.背景:background-size 设置背景图片的尺寸 background-origin 设置背景图片的原点
background-clip 设置背景图片的裁切区域,以”,”分隔可以设置多背景,用于自适应布局
6.渐变:linear-gradient、radial-gradient
7. 过渡:transition,可实现动画
8. 自定义动画 animate @keyfrom
9. 在 CSS3 中唯一引入的伪元素是 ::selection. 10. 媒体查询,多栏布局 @media screen and (width:800px){ … }
11. border-image
12.2D 转换:transform:translate(x,y) rotate(x,y) skew(x,y) scale(x,y)
13. 3D 转换
14 字体图标 font-face
15 弹性布局 flex
二、CSS3 新增伪类有那些?
:first-child选择器 匹配父元素中的第一个子元素
:last-child选择器 匹配父元素中的最后一个选择器
:nth-child(number|odd|even|倍数) 第几个元素 odd表示奇数、even表示偶数、2n:2的倍数、 4n:4的倍数
:checked 单选框或复选框被选中
在Web表单中,有些表单元素(如输入框、密码框、复选框等)有“可用”和“不可用”这2种状态。默认情况下,这些表单元素都处在可用状态。在CSS3中,我们可以使用:enabled选择器和:disabled选择器来分别设置表单元素的可用与不可用这两种状态的CSS样式。
三、CSS3 动画和 JS 动画主要的不同点是什么?
功能涵盖面,JS 比 CSS3 大
①定义动画过程的@keyframes 不支持递归定义,如果有多种类似的动画过程,需要调节多个参数来生成的话,将会有很大的冗余(比如 jQuery Mobile 的动画方案),而 JS 则天然可以以一套函数实现多个不同的动画过程
② 时间尺度上,@keyframes 的动画粒度粗,而 JS 的动画粒度控制可以很细
③ CSS3 动画里被支持的时间函数非常少,不够灵活
④ 以现有的接口,CSS3 动画无法做到支持两个以上的状态转化
实现/重构难度不一,CSS3 比 JS 更简单,性能调优方向固定
对于帧速表现不好的低版本浏览器,CSS3 可以做到自然降级,而 JS 则需要撰写额外代码
CSS 动画有天然事件支持(TransitionEnd、AnimationEnd,但是它们都需要针对浏览器加前缀),JS 则需要自己写事件
CSS3 有兼容性问题,而 JS 大多时候没有兼容性问题
四、用 css 画一个三角形,圆,椭圆?
css 画一个圆
css 画一个三角形
css 画一个椭圆
五、什么是 Web Worker?为什么我们需要它
查看如下代码(模拟会执行上百万次的繁重代码):
function test(){for(i=0;i< 10000000000 ; i ++){x = x + i;
}
}
- 如果上述代码在 HTML按钮点击以后执行,这种执行是同步的,即,浏览器必须等到此执行完毕之后才能进行其他操作。因为此操作耗时较长,那么这个操作会导致浏览器冻结并且没有响应,而且屏幕还会出现异常信息。
- 如果可以将这些繁重的代码移动到 Javascript 文件中,并采用异步的方式运行,就可以解决这个问题。这就是 web worker的作用。Web Worker 用于异步执行 JavaScript 文件,提高浏览器的敏捷度。
前端—每天5道面试题(十二)相关推荐
- 前端—每天5道面试题(十)
前端-每天5道面试题(十) 每天进步1% 不多 就1% 一.用 div+css 布局的好处? 表现和内容相分离 将设计部分剥离出来放在一个独立样式文件中,HTML 文件中只存放文本信息. 提高搜索引擎 ...
- 前端—每天5道面试题(十三)
前端-每天5道面试题(十三) 一.display:none:和visibilty:hidden ;和opacity:0:和overflow:hidden的区别? display:none:隐藏自己,隐 ...
- 前端—每天5道面试题(十一)
前端-每天5道面试题(十一) 每天进步1% 不多 就1% 一.简述对 Web 语义化的理解? 就是让浏览器更好的读懂你写的代码,在进行 HTML 结构.表现.行为设计时,尽量使用语义化的标签,使程序代 ...
- 前端—每天5道面试题(九)
前端-每天5道面试题(九) 每天进步1% 不多 就1% 一.overflow 有哪些属性值? Visible:默认值,内容不会被修剪,会呈现在元素框之外. Hidden:内容会被修剪,并且其余内容是不 ...
- 前端—每天5道面试题(5)
前端-每天5道面试题(5) 每天背5道前端面试题,希望我可以在远方的终点见到你 1.简述一下前端的性能优化问题 (一).页面内容方面 通过文件合并.css 雪碧图.使用 base64 等方式来减少 H ...
- 前端—每天5道面试题(3)
前端-每天5道面试题(3) 每天背5道前端面试题,希望我可以在远方的终点见到你 1.JavaScript是一门什么样的语言,它有哪些特点? javaScript一种直译式脚本语言,是一种动态类型.弱类 ...
- 前端—每天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) 优点:解决了同步的问题(只要有一个任 ...
最新文章
- 运行ORB-SLAM笔记_编译篇(一)
- 医 系统 springboot搜索到的spring boot 的javaweb项目
- java B2B2C 源码 多级分销Springcloud多租户电子商城系统- 整合企业架构的技术点(二)...
- matlab sae模型,matlab的Deep Learning的toolbox 中的SAE算法
- 一个App完成入门篇(一)-从Hello world开始
- pyqt5讲解3:QComboBox,QSpinBox,QSlider
- OpenCV findContours和drawContours用法的实例(附完整代码)
- 基本概念—机器学习ML与深度学习DL
- HTML5概要与新增标签
- 5.深度学习练习:Deep Neural Network for Image Classification: Application
- python将txt读入矩阵_Python3 把txt数据文件读入到矩阵中
- lock mysql unlock_MySql中Lock命令和unlock命令
- ubuntu命令行语法_Linux中重定向命令行的总结(ubuntu学习第三讲)
- 对无焦点窗口模拟按键_键盘不为人知的一面——单按键篇
- 微信小程序之实现下拉刷新效果
- DDR3的容量计算方法
- php arrayaccess什么作用,PHP中的ArrayAccess用法详解
- TSP_旅行商问题 - 模拟退火算法(三)
- rust进水器怎么用_净水器的使用方法和注意事项
- #Reading Paper# 【序列推荐综述】IJCAI‘19:Sequential Recommender Systems: Challenges, Progress and Prospects
热门文章
- linux文件描述符导致squid拒绝服务
- 基于HTML5的WebGL实现的2D3D迷宫小游戏
- IOS开发中的几种设计模式
- PKI与证书服务应用-要点总结
- float 最小误差_关于float与double结果的误差
- 计算机在言语康复的应用,实物交互在言语康复训练中的应用.pdf
- 计算机系统-电路设计10-寄存器的内部电路实现(输入与输出不同线)
- Redis-数据结构03-跳跃表(skiplist)
- bootstrap pagewrapper_BootStrap table服务端分页
- 大学计算机科学计术的总结,学好大学计算机科学与技术 要注意当天小结