1：flex布局

.flex-between {
    display: flex;
    justify-content: space-between;
}

.flex-evenly {
    display: flex;
    justify-content: space-evenly;
}

.flex-end {
    display: flex;
    justify-content: flex-end;
}

.flex {
    display: flex;
}

.flex-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

.TB-center {
    display: flex;
    align-items: center;
}

.flex-grow {
    flex-grow: 1;
}

2：表格类

1：表格的单元格超出变为 ...

::v-deep .el-table .cell.el-tooltip div{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

其他常见的：

1：点击出现小手蓝色

.clickStyle {
    cursor: pointer;
    color: #409eff;
}

2：超出（一/二行）变为...

//超出（一行），变为...（点点点）
.font-ellipsis-one {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
//超出（二行），变为...（点点点）
.font-ellipsis-two {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

3：阴影

//         阴影
.shadow {
	box-shadow: 0px 0px 15px 5px #ccc;
}
/*
	h-shadow	必需的。水平阴影的位置。允许负值
  v-shadow	必需的。垂直阴影的位置。允许负值
  blur	可选。模糊距离
  spread	可选。阴影的大小
  color	可选。阴影的颜色。在CSS颜色值寻找颜色值的完整列表
  inset	可选。从外层的阴影（开始时）改变阴影内侧阴影
*/