1.保持区域长宽比
//此处保持10:31.25长宽比
overflow:hidden
width: 100%
height: 0
padding-bottom: 31.25%
如果不保持长宽比，则在加载页面的时候，会出现布局的波动。
也可以使用
width: 100%
height: 31.25vm
但是兼容性不好
解释：
经过试验可以发现overflow: hidden只会隐藏超出边界的内容，而在height和padding的内容不会被隐藏
图中灰色区域的内容不会被隐藏.png
但要注意，不能直接将height设置为23.5%，因为height的百分比是相对于其父级元素的的，而padding和margin的百分比则是相对于父级元素的width。所以要使用padding实现固定长款比的元素。
- 将过长字符串隐藏并显示...
overflow: hidden
text-overflow: ellipsis
white-space: nowrap
如果在flex布局下的组件不能成功隐藏
可以在其中加一句 min-width: 0
.info{
display: flex
min-width: 0
}
