小米前端一面

• background-image 与img标签的区别
  1.background-image无法使用懒加载，而img标签可以通过设置其src进行懒加载的实现
  2.加载顺序不同： background-image是css属性，img标签中如果有src会立即请求，img会优先background-image进行请求
  3.图片设置性不同：background-image 可以借助其本身css属性中的background-position、background-size来设置图片展示的位置关系，大小显示关系，而img标签无法直接设置其图片显示位置
  4.img标签能更好的SEO，是html标签，代表文档内容，而background-image属于css，代表版式设计。而言之，img标签能更好的SEO，而background-image更加灵活

• 行内元素与块级元素的区别

1.行内元素和其他行内元素都会在一条水平线上排列，都是在同一行的；块级元素却总是会在新的一行开始排列，各个块级元素独占一行
2.行内元素不可以设置宽高，宽度高度随文本内容的变化而变化；块级元素可以设置宽高，并且宽度高度以及外边距，内填充都可随意控制
3.行内块状元素特征：(1)不自动换行　　(2)能够识别宽高

• Canvas 和 SVG

1.svg绘制出来的每一个图形元素都是独立的DOM节点，可方便后期绑定事件或修改，而canvas输出的是一整幅画布
2.svg输出的图形是矢量的，后期可以修改参数来自由放大缩小，无失真，canvas输出标量画布，就像一张图片一样

• 绝对定位和相对定位

区别：绝对定位是相对于元素最近的已定位的祖先元素进行偏移，绝对定位本身与文档流无关，因此不占空间。相对定位是相对于元素在文档中的初始位置进行偏移，无论是否进行移动，元素仍然占据原来的空间；因此，移动元素会导致它覆盖其它框

• rgba和opacity的区别

opacity属性的值，可以被其子元素继承，给父级div设置opacity属性，那么所有子元素都会继承这个属性，并且，该元素及其继承该属性的所有子元素的所有内容透明度都会改变。而RGBA设置的元素，只对该元素的背景色有改变，并且，该元素的后代不会继承该属性

• 单行和多行隐藏

https://www.cnblogs.com/wmbuke/p/13756017.html

• 观察者模式与发布/订阅模式区别

https://www.cnblogs.com/lovesong/p/5272752.html