一般使用flex布局：
如果是橫向的，就不加寬度，不然超出后默認(rèn)會(huì)橫向壓縮
如果是縱向的，就不加高度，不然超出后默認(rèn)會(huì)縱向壓縮
但是，你也可以使用 flex-shrink這個(gè)屬性來(lái)控制，如果空間不足的時(shí)候，不讓它自動(dòng)壓縮。
flex-shrink默認(rèn)是1，表示空間不足的時(shí)候自動(dòng)進(jìn)行壓縮；設(shè)置為0的時(shí)候，表示空間不足時(shí)，不讓它進(jìn)行壓縮。
相對(duì)應(yīng)的屬性flex-grow是控制剩余空間的，默認(rèn)是0；表示如果存在剩余空間，也不進(jìn)行放大flex項(xiàng)目。
為什么會(huì)寫這個(gè)？
因?yàn)樵賹戫?xiàng)目的時(shí)候，有控制文字兩行溢出顯示的。
本來(lái)兩行文本溢出的css是這樣的：
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
文字上方的圖片與文字在一個(gè)flex容器中，而且對(duì)這個(gè)flex容器設(shè)置了固定高度。
其中有個(gè)手機(jī)，兩行文字有一部分被遮住，使用高度與行高控制也達(dá)不到設(shè)計(jì)稿上的樣式（高度是行高的兩倍）。
