寬度受限，文字溢出（純CSS解決辦法）

當文字總長度超過盒子寬度，出現溢出佈局混亂時能夠用如下代碼來解決
（注：只適用於單行文本，多行須要使用js作控制）

CSS代碼：

h4 {
    //根據屏窗口寬度設置h4寬度
    width: 21vw;
    //設置最小寬度
    min-width: 240px;
    //文字大小
    font-size: 18px;
    //文字不換行
    white-space: nowrap;
    //超出部分隱藏
    overflow: hidden;
    //文字溢出顯示...
    text-overflow: ellipsis;
    //===============  代碼切割  ==================
    font-family: Microsoft YaHei;
    font-weight: bold;
    color: rgba(51, 51, 51, 1);
    margin-bottom: 20px;
    text-align: center;
    cursor: pointer;  
 }

效果對比圖：