一些意想不到的小bug。

一，當if的時候，很容易忘記相對的else,從而出現bug，要將背面消息考慮全面。
二，多個元素在同一行佈局的時候，要考慮文字的換行仍是省略號代替。

例如：左邊一個文字，寬度不固定，右邊一個圖形，寬度固定。左邊文字多的時候，在小屏手機上不換行，用省略號代替，然而在大屏手機上還能夠顯示比小屏手機多一些字數，這樣保證全部元素對齊而且保持在一行。
結構：

<div class="container">
    <div class="left-text">
        <span>此處的文字字數不固定</span>
    </div>
    <div class="right-graf">
        <i></i>
    </div>
</div>

style: 
.container: {
    display: flex;
    flex-item: center;
}
.right-graf: {
    width: 120px;//固定寬度
    i {
        箭頭樣式；省略。。。。
    }
}
.left-text: {//此樣式能夠保證在小屏手機上不換行，用省略號代替多餘的文字，在大屏手機上能夠顯示更多文字。
    max-width: 160px;//此寬度爲在小屏手機例如ipone5上在右邊寬度固定的狀況下，可以使文字不換行的最大寬度
    white-space: nowrap;//不換行
    overflow: hidden;
    text-overflow: ellipsis;//省略號代替
}