Skip to content

CSS

单行省略

css
.class {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

多行省略

css
.class {
  display: -webkit-box; /* 将对象作为弹性伸缩盒子模型显示 */
  -webkit-box-orient: vertical; /* 设置或检索伸缩盒对象的子元素的排列方式 */
  -webkit-line-clamp: 2; /* 2行,只有 webkit内核支持 */
  word-break: break-all; /* 纯英文换行 */
  overflow: hidden;
}

禁止选中文字

css
.class {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

禁止拖拽

css
/* 未试用 */
.class {
  -webkit-user-drag: none;
  -moz-user-drag: none;
  -ms-user-drag: none;
}

页面变灰

css
html {
  filter: grayscale(1);
}

给透明背景的图片内容加边框

css
.class {
  filter: drop-shadow(-3px -3px 1px #000);
}