有限長度空間內文本長度超出後經過css實現截取並顯示省略號的方法

實現方法：

html:
<div class="outer2">
    <div class="outer">
        <span class="inner">朗御2單元29F弱電井F-RRU637677_05</span>
    </div>
</div>
css:
.outer{
    max-width: 100px;
    overflow-x: hidden;
    white-space: nowrap;
    text-overflow: ellipsis; /* 若是超過字段須要顯示爲... */
}
.inner{
    max-width: 400px;
}

max-width內外元素都要設置，爲的是實現元素的溢出效果；

overflow-x: hidden; 溢出

white-space: nowrap; 內容不換行

text-overflow: ellipsis; 超過字段顯示省略號

以上三個樣式設置是爲了實現上圖所示的效果，三者必須同時使用。

注意：此方式只是用於一個層級嵌套的元素，若是設置在類outer2，

則不會出現這個效果，注意這個坑。