overflow-inline

Baseline 2023
新推出

自 2023 年 9 月起,此功能可在最新的裝置和瀏覽器版本上使用。此功能可能無法在較舊的裝置或瀏覽器上使用。

overflow-inline CSS 媒體特性可用於測試輸出裝置如何處理內容沿內聯軸超出初始包含塊的情況。

注意: overflow-inline 屬性不決定是否發生溢位;它揭示了裝置如何處理這種溢位。通常,在大多數瀏覽器的螢幕上,行為將是“滾動”:當內容超出可用水平空間時,裝置允許您滾動以訪問溢位的內容。

語法

overflow-inline 特性被指定為從下面列表中選擇的關鍵字值。

none

超出內聯軸的內容不顯示。

scroll

超出內聯軸的內容可以透過滾動來檢視。

示例

HTML

html
<p>
  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ac turpis
  eleifend, fringilla velit ac, aliquam tellus. Vestibulum ante ipsum primis in
  faucibus orci luctus et ultrices posuere cubilia Curae; Nunc velit erat,
  tempus id rutrum sed, dapibus ut urna. Integer vehicula nibh a justo imperdiet
  rutrum. Nam faucibus pretium orci imperdiet sollicitudin. Nunc id facilisis
  dui. Proin elementum et massa et feugiat. Integer rutrum ullamcorper eleifend.
  Proin sit amet tincidunt risus. Sed nec augue congue eros accumsan tincidunt
  sed eget ex.
</p>

CSS

css
p {
  white-space: nowrap;
}

@media (overflow-inline: scroll) {
  p {
    color: red;
  }
}

結果

規範

規範
媒體查詢第 4 級
# mf-overflow-inline

瀏覽器相容性