一、起因
需求要求展示兩行,多余的文字用三個點替代,于是用了這幾個不太規(guī)范的屬性
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;后來發(fā)現(xiàn)代碼里寫的好好的,一到頁面上居然沒有反應,和沒寫一個樣,f12看了下,原來是-webkit-box-orient: vertical;這個屬性丟失,導致了不生效,在Styles里把這個屬性加上就好了,于是斷定是編譯過程導致這個屬性丟失。
二、解決辦法
網(wǎng)上找了一個可行的解決方案,把autoprefixer關掉,有一種寫法:
/*! autoprefixer: off */
-webkit-box-orient: vertical;
/* autoprefixer: on */
這樣確實解決了編譯丟失的情況,但會在編譯過程中報warning,最后到GitHub上找到最佳解決方案,如下
/* autoprefixer: ignore next */
-webkit-box-orient: vertical;
問題完美解決,也不報warning了。
新聞熱點
疑難解答