css兼容

• 为了让CSS3样式兼容，需要将某些样式加上浏览器前缀：

1. -ms- 兼容IE浏览器
2. -moz- 兼容firefox
3. -o- 兼容opera
4. -webkit- 兼容chrome 和 safari

在 chrome 里面样式是没有问题的,切换到 firefox 就出现了 input 和 button 元素之间的不对齐

.el-autocomplete {
  // 在对应的类名里添加 对应浏览器的兼容前缀
  -moz-transform: translateY(5px);
}

添加兼容后

className:empty {} 判断类是否为空

伪插槽

// 兄弟元素
.left-xd {
  display: none;
}

.left:empty + .left-xd {
  display: block
}