CSS小知识

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

---

01-滚动条消失术

//滚动条消失术
.el-main {
  background: #fff;
  height: calc(100vh - 140px);
  -ms-overflow-style: none;
  overflow: -moz-scrollbars-none;
  &::-webkit-scrollbar {
    width: 0 !important;
  }
  -ms-overflow-style: none;
  scrollbar-width: none;
}

---

02-禁止复制页面内容

  -moz-user-select: -moz-none;
  -moz-user-select: none;
  -o-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  

---

03-判断数据类型

//判断数据类型
  if (Object.prototype.toString.call(row) === '[object Array]') {
        undefined
        console.log('数据为数组类型')
      }
      if (Object.prototype.toString.call(row) === '[object Object]') {
        undefined
        console.log('数据为对象类型')
      }
      if (Object.prototype.toString.call(row) === '[object String]') {
        undefined
        console.log('数据为字符串类型')
      }

---

04-使页面处于灰色模式–(类似)。

示例: 页面置灰

/* filter: grayscale(1); */

---

05-多行文本溢出时显示省略号

  overflow: hidden;
  text-overflow: ellipsis;

  display: -webkit-box;
  /* set n lines, including 1 */
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;

---

06-单行文本溢出时显示省略号

  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: 375px;

---

文章出处:
链接1:https://mp.weixin.qq.com/s/aBClufNPYWq7wUXvFrxuug