內容：

<section id='news'>
        <div class='container news-content d-flex justify-content-center'>
            <div class='news-title'>
                <span>全部新聞</span>
            </div>
            <ul class="nav nav-tabs news-tablist" role="tablist">
                <li class="nav-item">
                    <a class="nav-link active" data-toggle="tab" href="#allnews" data-title="全部新聞">
                        <i class='icon-allnews'></i>
                    </a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" data-toggle="tab" href="#meiti" data-title="媒體報道">
                        <i class='icon-meiti'></i>
                    </a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" data-toggle="tab" href="#toutiao" data-title="頭條">
                        <i class='icon-toutiao'></i>
                    </a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" data-toggle="tab" href="#zixun" data-title="諮詢">
                        <i class='icon-zixun'></i>
                    </a>
                </li>
            </ul>
 

css：

#news .news-tablist {
    display: flex;
    flex-direction:column;縱向排列
    border-bottom:none;
}
#news .news-tablist i.icon-allnews::before {
    content: '\e90e';
    font-size:30px;
    color: white;
}
#news .news-tablist i.icon-meiti::before {
    content: '\e90f';
    font-size:30px;
    color: white;
}
#news .news-tablist i.icon-toutiao::before {
    content: '\e910';
    font-size:30px;
    color: white;
}
#news .news-tablist i.icon-zixun::before {
    content: '\e911';
    font-size:30px;
    color: white;
}
#news .news-tablist li a:hover {
    background: #E9232C;
}
flex-direction:column;縱向排列
    border-bottom:none;
}
#news .news-tablist i.icon-allnews::before {
    content: '\e90e';
    font-size:30px;
    color: white;
}
#news .news-tablist i.icon-meiti::before {
    content: '\e90f';
    font-size:30px;
    color: white;
}
#news .news-tablist i.icon-toutiao::before {
    content: '\e910';
    font-size:30px;
    color: white;
}
#news .news-tablist i.icon-zixun::before {
    content: '\e911';
    font-size:30px;
    color: white;
}
#news .news-tablist li a:hover {
    background: #E9232C;
}
 

圖示：