box-orient
非標準：此特性未標準化。我們不建議在生產環境中使用非標準特性，因為它們瀏覽器支援有限，並且可能會更改或被移除。但是，在沒有標準選項的特定情況下，它們可以是合適的替代方案。
已棄用：此特性不再推薦。雖然某些瀏覽器可能仍然支援它，但它可能已經從相關的網路標準中刪除，可能正在刪除過程中，或者可能僅為相容性目的而保留。請避免使用它，如果可能，請更新現有程式碼；請參閱本頁底部的相容性表格以指導您的決策。請注意，此特性可能隨時停止工作。
警告： 這是原始 CSS 彈性盒佈局模組草案的屬性，已被更新的標準取代。有關當前標準的資訊，請參閱彈性盒。
box-orient CSS 屬性設定元素是水平還是垂直地佈置其內容。
語法
css
/* Keyword values */
box-orient: horizontal;
box-orient: vertical;
box-orient: inline-axis;
box-orient: block-axis;
/* Global values */
box-orient: inherit;
box-orient: initial;
box-orient: unset;
box-orient 屬性指定為下面列出的關鍵字值之一。
值
horizontal-
盒模型水平佈置其內容。
vertical-
盒模型垂直佈置其內容。
inline-axis（行內軸）-
盒模型沿行內軸顯示其子級。
block-axis（塊級軸）-
盒模型沿塊級軸顯示其子級。
行內軸和塊級軸是依賴於書寫模式的關鍵字，在英語中，它們分別對映到 horizontal（水平）和 vertical（垂直）。
描述
HTML DOM 元素預設沿行內軸佈置其內容。此 CSS 屬性僅適用於具有 CSS display 值為 box 或 inline-box 的 HTML 元素。
正式定義
正式語法
box-orient =
horizontal |
vertical |
inline-axis |
block-axis
示例
設定水平盒模型方向
在此處，box-orient 屬性將導致示例中的兩個 <p> 部分在同一行中顯示。
HTML
html
<div class="example">
<p>I will be to the left of my sibling.</p>
<p>I will be to the right of my sibling.</p>
</div>
CSS
css
div.example {
display: -moz-box; /* Mozilla */
display: -webkit-box; /* WebKit */
display: box; /* As specified */
/* Children should be oriented vertically */
-moz-box-orient: horizontal; /* Mozilla */
-webkit-box-orient: horizontal; /* WebKit */
box-orient: horizontal; /* As specified */
}
結果
規範
不屬於任何標準。
瀏覽器相容性
載入中…