最近在做vue項(xiàng)目的時(shí)候頁(yè)面處理多行文本樣式時(shí)用到了-webkit-box-orient: vertical這個(gè)屬性，本地跑項(xiàng)目沒(méi)問(wèn)題，但是打包放到服務(wù)器后發(fā)現(xiàn)這個(gè)屬性丟失了。如下圖：
.news-link .news-link-item .item-info .item-p {
? width: 765px;
? font-size: 14px;
? color: #797271;
? line-height: 28px;
? text-align: left;
? word-break:break-all;
? display:-webkit-box;
? -webkit-line-clamp:3;
? -webkit-box-orient:vertical;
? overflow:hidden;
}
后來(lái)在網(wǎng)上查詢(xún)一番，發(fā)現(xiàn)可能是optimize-css-assets-webpack-plugin這個(gè)插件的問(wèn)題，其實(shí)解決辦法很簡(jiǎn)單，只需要在這個(gè)屬性前后加一個(gè)特殊注釋即可，如下圖：
.news-link .news-link-item .item-info .item-p {
? width: 765px;
? font-size: 14px;
? color: #797271;
? line-height: 28px;
? text-align: left;
? word-break:break-all;
? display:-webkit-box;
? -webkit-line-clamp:3;
? /*! autoprefixer: off */
? -webkit-box-orient:vertical;
? /* autoprefixer: on */
? overflow:hidden;
}
