关于css:写一写会经常用到的CSS样式

批改滚动条款式

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
/* 定义滚动条轨道 内暗影 + 圆角 */
::-webkit-scrollbar-track {
  border-radius: 10px;
  background-color: rgba($color: #ffffff, $alpha: 0.7);
}
/* 定义滑块 内暗影 + 圆角 */
::-webkit-scrollbar-thumb {
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  background-color: rgba(0, 0, 0, 0.3);
  &:hover {background-color: rgba(0, 0, 0, 0.53);
    cursor: pointer;
  }
}

禁止在页面中选中文本进行复制

-webkit-user-select:none; /*webkit 浏览器 */
  -khtml-user-select:none; /* 晚期浏览器 */
  -moz-user-select:none; /* 火狐 */
  -ms-user-select:none; /*IE10*/
  user-select:none; /* 用户是否可能选中文本 */

字体超出长度以 … 模式展现

width: 50px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
-webkit-line-clamp: 2;  // 这个是管制显示几行当前... 的
// 还有一些能够参考
word-break:break-all;// 以英文字母作为换行根据
word-wrap:break-word; // 以英文单词作为换行根据
white-space:pre-wrap;// 以中文作为换行根据

让文字平分宽度间距对齐

.tagLiTitle {
    width: 70px;
    height: 20px;
    margin-right: 20px;
    text-align: justify;
    color: #7cb305;
    i {
      display: inline-block;
      width: 100%;
    }
  }

应用的时候
<div class="tagLiTitle">XXX<i></i></div>