css box-direction属性怎么用


本文摘自PHP中文网,作者藏色散人,侵删。

css box-direction属性用于定义框元素的子元素以什么方向来排列,其语法是box-direction: normal|reverse|inherit,normal以默认方向显示子元素。

css box-direction属性怎么用

作用:定义框元素的子元素以什么方向来排列。

语法:

1

box-direction: normal|reverse|inherit;

说明:

normal以默认方向显示子元素。reverse以反方向显示子元素。inherit应该从子元素继承 box-direction 属性的值

注释:

目前没有浏览器支持 box-direction 属性。Firefox 支持替代的 -moz-box-direction 属性。Safari、Opera 以及 Chrome 支持替代的 -webkit-box-direction 属性。

css box-direction属性使用示例

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

<!DOCTYPE html>

<html>

<head>

<style>

div

{

width:350px;

height:100px;

border:1px solid black;

/* 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;

}

</style>

</head>

<body>

<div>

<p>段落 1。</p>

<p>段落 2。</p>

<p>段落 3。</p>

</div>

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

</body>

</html>

效果输出:

55d36ebd068c905b7fbcb90af753f18.png

以上就是css box-direction属性怎么用的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

js和css文件位置对页面性能有什么影响?

css如何让鼠标放上时的小手样式

css布局方法有哪些

15 个优秀的响应式 web 设计 html 和 css 框架

css如何添加flash

为什么要用css

css绝对路径怎么写

css如何设置不规则阴影

css中文乱码怎么办

css column-width属性怎么用

更多相关阅读请进入《css》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...