前端CSS样式

div左右出现滚动条

<div className={style.ii}>
    <div className={style.uu}>1</div>
    <div className={style.uu}>2</div>
    <div className={style.uu}>3</div>
    <div className={style.uu}>4</div>
</div>

.ii {
        margin-top: 50px;
        width: 600px;
        height: 60px;
        overflow: auto;
        white-space: nowrap;

        .uu {
          width: 50%;
          height: 50px;
          border: 1px solid red;
          display: inline-block;
        }

}

文本超出内容显示省略号

/*主要复制这三行，基本就有效果，没有效果的话，那得设置具体宽度*/
white-space:nowrap; 
overflow:hidden; 
text-overflow:ellipsis;

/*超出2行就显示省略号，可以填3或者其它正整数*/
overflow : hidden;
white-space: normal;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;

鼠标放上去修改默认样式

/*普通箭头*/
cursor: default;
/*手指*/
cursor: pointer;
/*文本输入条*/
cursor: text;
/*向右箭头(表示链接)*/
cursor: e-resize;
/*向左箭头(表示返回)*/
cursor: w-resize;
/*放大镜(表示放大)*/
cursor: zoom-in;
/*缩小镜(表示缩小)*/
cursor: zoom-out;

文本不可选中

user-select: none;