box

英[bɒks] 美[bɑ:ks]

n.Box; box-like object; box; sentry room

vt. Put... into a box [box, box]

vt.& vi.Boxing

Third person singular: boxes Plural: boxes Present participle: boxing Past tense: boxed Past participle: boxed

##orient

UK[ˈɔ:rient] US[ˈɔriənt, -ˌɛnt, ˈor-]

vt. Calibrate the direction; make... East; refer to...; make familiar or adapt to

adj. Eastern; (sun, etc.) rising, new; sparkling

vi. Turn to the East; make adjustments or become A straight line

n. East Asian countries; pearl luster; good pearls; sunrise, east

Third person singular: orients Present participle: orienting Past tense: oriented Past participle: oriented

css box-orient property syntax

Function: Specifies whether the child elements of the box should be arranged horizontally or vertically.

Syntax: box-orient: horizontal|vertical|inline-axis|block-axis|inherit;

Description: horizontal Arrange child elements from left to right in a horizontal row. vertical Arrange child elements vertically from top to bottom. inline-axis Arranges child elements along the inline axis (mapped to horizontal). block-axis Arranges child elements along the block axis (mapped to vertical). inherit should inherit the value of the box-orient property from the parent element.

Note: The sub-elements in the horizontal box are displayed from left to right, while the sub-elements in the vertical box are displayed from top to bottom. However, box-direction and box-ordinal-group can change this order.

css box-orient property example

<!DOCTYPE html>
<html>
<head>
<style> 
div
{
width:350px;
height:150px;
border:1px solid black;
  
/* Firefox */
display:-moz-box;
-moz-box-orient:horizontal;

/* Safari, Opera, and Chrome */
display:-webkit-box;
-webkit-box-orient:horizontal;

/* W3C */
display:box;
box-orient:horizontal;
}
</style>
</head>
<body>

<div>
<p>段落 1。</p>
<p>段落 2。</p>
<p>段落 3。</p>
</div>

<p><b>注释：</b>IE 不支持 box-orient 属性。</p>

</body>
</html>

Run instance »

Click the "Run instance" button to view the online instance