前端小知识收集

1.css 一行文本超出…

overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;

2.多行文本超出显示…

display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;

3.IOS 手机容器滚动条滑动不流畅

overflow: auto;
-webkit-overflow-scrolling: touch;

4.display flex 布局 （自定义内部子元素左右偏移，文字类）

// 父元素
display: flex;
flex-direction: row;
align-items: center;
font-size: 18px;
justify-content: space-between;

//子元素
text-align: right;

5.水平垂直居中

div {
    width: 100px;
    height: 100px;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
}