CSS -webkit-box-orient: vertical屬性編譯後丟失問題

1、原由

需求要求展現兩行,多餘的文字用三個點替代,因而用了這幾個不太規範的屬性css

display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;

後來發現代碼裏寫的好好的,一到頁面上竟然沒有反應,和沒寫一個樣,f12看了下,原來是-webkit-box-orient: vertical;這個屬性丟失,致使了不生效,在Styles裏把這個屬性加上就行了,因而判定是編譯過程致使這個屬性丟失。git

2、解決辦法

網上找了一個可行的解決方案,把autoprefixer關掉,有一種寫法:github

/*! autoprefixer: off */
-webkit-box-orient: vertical;
/* autoprefixer: on */

這樣確實解決了編譯丟失的狀況,但會在編譯過程當中報warning,最後到GitHub上找到最佳解決方案,以下web

/* autoprefixer: ignore next */
-webkit-box-orient: vertical;

問題完美解決,也不報warning了。post

相關文章
相關標籤/搜索