如何控制 CSS 'div' 元素中的水平捲軸？

控制CSS 'div' 元素中的水平捲軸

在CSS 中使用'div' 容器時，您可能會遇到只需要水平捲軸的情況。本文介紹如何實現此行為。

在提供的程式碼片段中，您已將“overflow”屬性配置為“auto”，這樣當內容超過指定的寬度或高度時，允許水平和垂直滾動。若要限制捲動到水平面，請修改“overflow-y”屬性，如下所示：

div#tbl-container {
    overflow: hidden;
    overflow-y: auto;
    scrollbar-base-color: #ffeaff;
}

透過將“overflow-y”設定為“auto”，如果內容高度超過，則允許自動垂直滾動“div”高度，而“overflow”設定為“hidden”會阻止水平滾動，除非內容寬度超過指定的“div”寬度。

中Internet Explorer (IE) 版本6-7，需要額外的CSS3 擴充功能來抑制垂直捲軸：

div#tbl-container {
    overflow: auto;
    overflow-y: hidden;
    scrollbar-base-color: #ffeaff;
    -ms-overflow-y: hidden;
}

由於Microsoft 指定了預候選版本，因此採用「-ms 」前綴來適應IE8自己的命名空間下的建議標準屬性。

值得注意的是，IE8 可能已經解決了這個錯誤，消除了對「-ms」的需要前綴。儘管如此，上面提到的 CSS 修改應該可以在控制「div」元素的捲軸方面提供所需的結果。

以上是如何控制 CSS 'div' 元素中的水平捲軸？的詳細內容。更多資訊請關注PHP中文網其他相關文章！