css 小技巧

   使页面处于灰色模式 body {

            filter: grayscale(1);

        }

多行溢出

.more-line-ellipsis {  overflow: hidden;  text-overflow: ellipsis;
  display: -webkit-box;  /* set n lines, including 1 */  -webkit-line-clamp: 2;  -webkit-box-orient: vertical;}

 水平和垂直居中元素

 /* Key Style */  display: flex;  align-items: center;  justify-content: center;

不允许选择文本
/* Key Style */.box p:last-child {  user-select: none;}

滚动条影藏

/* Key Style */.box-hide-scrollbar::-webkit-scrollbar {  display: none; /* Chrome Safari */}

自定义选中样式

     /* Key Style */

        .box-custom::selection {

            color: #ffffff;

            background-color: #ff4c9f;

        }

解决iOS滚动条卡住的问题

body,html{  -webkit-overflow-scrolling: touch;}

输入框选中状态去掉

/* Key Style */
.no-outline {  outline: none;}

Type=number 去掉尾部的箭头

input::-webkit-input-placeholder {  color: #4f4c5f;  font-size: 14px;}/* Key Style */.no-arrow::-webkit-outer-spin-button,.no-arrow::-webkit-inner-spin-button {  -webkit-appearance: none;}

文本框插入前光标颜色

 /* Key Style */  caret-color: #ffd476;
占位符样式，input
/* Key Style */.placehoder-custom::-webkit-input-placeholder {  color: #babbc1;  font-size: 12px;}

最后一条不需要下划线

   li:not(:last-child) {

                border-bottom: 1px solid #ebedf0;

            }