box-orient
非标准
该特性是非标准的，请尽量不要在生产环境中使用它！
这是原始的css弹性布局草案的一个属性，已经被最新的标准替代。 查看 flexbox 了解现行标准。
box-orient 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(HTML)- 盒子沿内联轴展示其子元素。
block-axis(HTML)- 盒子沿块轴展示其子元素。
内联轴和块轴取决于写入模式的关键字，在英语中，分别对应水平和垂直方向。
规范
| 初始值 | inline-axis (horizontal in XUL) |
|---|---|
| 适用元素 | elements with a CSS display value of box or inline-box |
| 是否是继承属性 | 否 |
| 计算值 | as specified |
| Animation type | discrete |
正式语法
示例
设置盒子水平布局
在这里，box-orient 属性会将两个 <p> 段落布局到同一行。
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
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 */
}
结果
规范
不是任何标准的一部分。
浏览器兼容性
BCD tables only load in the browser