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

父div:spa

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

子div:it

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

display的值及解釋:table

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: 將對象做爲表格腳註組顯示容器

相關文章
相關標籤/搜索