父div：

.rootBar{
width: 1920px;
height: 216px;
float: left;
overflow-y: hidden;
overflow-x: auto;
white-space: nowrap;
}

子div：

.childrenBar{
width: 384px;
height: 216px;
position: relative;
display: inline-block;
}

display的值及解釋：

block: 塊對象的默認值。將對象強制作為塊對象呈遞，為對象之後添加新行
none: 隱藏對象。與 visibility 屬性的hidden值不同，其不為被隱藏的對象保留其物理空間
inline: 內聯對象的默認值。將對象強制作為內聯對象呈遞，從對象中刪除行
inline-block: 將對象呈遞為內聯對象，但是對象的內容作為塊對象，旁邊的內聯對象會被呈遞在同一行內
compact: 分配對象為塊對象或基於內容之上的內聯對象
marker: 指定內容在容器對象之前或之後。要使用此參數，對象必須和:after及:before偽元素一起使用
inline-table: 將表格顯示為無前後換行的內聯對象或內聯容器
list-item :將塊對象指定為列表項目。並可以添加可選項目標誌
table-caption: 將對象作為表格標題顯示
table-cell: 將對象作為表格單元格顯示
table-column: 將對象作為表格列顯示
table-column-group: 將對象作為表格列組顯示
table-header-group: 將對象作為表格標題組顯示
table-footer-group: 將對象作為表格腳註組顯示

子div超出父div部分橫向滾動，不換行