Shulou(Shulou.com)06/01 Report--

This article mainly introduces how to use the box-direction attribute in CSS3 technology, has a certain reference value, interested friends can refer to, I hope you can learn a lot after reading this article, the following let the editor take you to understand it.

Example

From right to left, display a child element of div box:

Div

{

Width:350px

Height:100px

Border:1px solid black

/ * Internet Explorer 10 * /

Display:-ms-flexbox

-ms-flex-direction:row-reverse

/ * Firefox * /

Display:-moz-box

-moz-box-direction:reverse

/ * Safari, Opera, and Chrome * /

Display:-webkit-box

-webkit-box-direction:reverse

/ * W3C * /

Display:box

Box-direction:reverse

}

Currently, mainstream browsers do not support the box-direction attribute.

Internet Explorer 10 is supported through the private attribute the-ms-flex-direction.

Firefox is supported through the private attribute-MOZ-box-direction.

Safari and Chrome pass through the private attribute-the WebKit-box-direction attribute.

Note: elastic frames are not supported in Internet Explorer 9 and earlier IE versions.

Grammar

Box-direction: normal | reverse | inherit

Normal is used to display child elements by default.

Reverse is used to display child elements in the opposite direction.

Inherit should inherit the value of the box-direction attribute from child elements

Thank you for reading this article carefully. I hope the article "how to use box-direction attributes in CSS3 Technology" shared by the editor will be helpful to everyone. At the same time, I also hope you will support us and pay attention to the industry information channel. More related knowledge is waiting for you to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.