一煤禽，單行省略
單行省略铐达，css3有屬性可以實(shí)現(xiàn)。廢話不多說檬果，直接貼代碼瓮孙。
only1.png
only2.png
only3.png
二，多行省略
多行省略可以用-webkit-line-clamp屬性选脊，但是這是個(gè)不規(guī)范屬性杭抠，并不在css草案中。是webkit瀏覽器或移動(dòng)端（絕大部分是webkit內(nèi)核）瀏覽器知牌。需要結(jié)合display:-webkit-box; -webkit-box-oriden:vertical;一起使用。其中斤程，若內(nèi)容是英文角寸，還需要結(jié)合word-break:break-all;屬性菩混。
moreE_1.png
moreE_2.png
moreE_3.png
若是中文則不需要word-break:break-all;
moreC_1.png
moreC_2.png
moreC_3.png
三，借助after實(shí)現(xiàn)多行省略
after1.png
after2.png
after3.png
小知識(shí)點(diǎn)：word-break:break-all & word-wrap:break-word & white-space:nowrap;
1.word-break:break-all; 用于英文單詞扁藕，若單詞很長沮峡，容器剩余距離不夠，則折斷該單詞亿柑。
2.word-wrap:break-word; 用于英文單詞邢疙，若單詞很長，容器剩余距離不夠望薄，則將整個(gè)單詞換行顯示疟游。
3.white-space:nowrap; 用于處理元素內(nèi)的空白，即只在一行顯示痕支，這樣就不會(huì)留空白颁虐。
