CSS3 propriété box-direction
Exemples
De droite à gauche, pour afficher une boîte de div éléments enfants:
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;
}
{
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;
}
Essayez »
support du navigateur
Le navigateur grand public actuel ne prend pas en charge les propriétés box-direction.
Internet Explorer 10 propriété privée par le soutien -ms-flex-direction.
Firefox par la propriété privée - Support MOZ-box-direction.
Safari et Chrome par la propriété privée des propriétés -webkit-box-direction.
Remarque: Internet Explorer 9 et les versions antérieures de IE ne prennent pas en charge la boîte flexible.
Définition des attributs et des instructions
attribut box-direction précise les éléments de la direction dans laquelle la zone d'affichage de l'enfant.
Par défaut: | normal |
---|---|
Héritée: | aucun |
Version: | CSS3 |
Syntaxe JavaScript: | objet .style.boxDirection = "reverse" |
grammaire
box-direction: normal | inverser | inherit;
valeur | description |
---|---|
normal | Dans les sous-éléments d'affichage à l'orientation par défaut. |
inverser | Dans le sens inverse des éléments de l'enfant. |
hériter | Vous devez hériter de la valeur de la propriété box-direction des sous-éléments |