What is the use of the box-orient attribute in css
Editor to share with you what is the use of the box-orient attribute in css, I believe most people do not know much about it, so share this article for your reference, I hope you can learn a lot after reading this article, let's go to know it!
How do I use the cssbox-orient attribute?
The box-orient attribute specifies whether the child elements of the box should be arranged horizontally or vertically.
Syntax:
Box-orient:horizontal | vertical | inline-axis | block-axis | inherit
Attribute value:
Horizontal: arranges child elements from left to right in a horizontal row.
Vertical: arranges 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: the value of the box-orient attribute should be inherited from the parent element.
Description: the child elements in the horizontal box are displayed from left to right, while the child elements in the vertical box are displayed from top to bottom. However, box-direction and box-ordinal-group can change this order.
Note: currently, all major browsers do not support the box-orient attribute. Firefox is supported through the private attribute-MOZ-box-orient. Safari,Opera, and Chrome are supported through the private attribute-webkit-box-orient.
Example of cssbox-orient property
Div {
Width:350px
Height:150px
Border:1pxsolidblack
/ * Firefox*/
Display:-moz-box
-moz-box-orient:horizontal
/ * Safari,Opera,andChrome*/
Display:-webkit-box
-webkit-box-orient:horizontal
/ * W3C*/
Display:box
Box-orient:horizontal
}
Paragraph 1.
Paragraph 2.
Paragraph 3.
Note: the box-orient attribute is not supported by IE.
The above is all the content of the article "what is the use of box-orient attributes in css". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!
