css3 flex 布局的问题

附上地址, 或者看下面代码。
https://jsfiddle.net/2ydhkep5/

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <style>
        * {
            margin:0;
            padding:0;
        }
        body,html {
            overflow: hidden;
            width: 100%;
            height: 100%;
        }
        .container {
            width: 100%;
            height: 100%;
            display: -webkit-flex;
        }
        .box-a {
            -webkit-flex: 5.5;
            background: #ccc;
            font-size: 30px;
        }
        .box-b {
            -webkit-flex: 4.5;
            background: #f6f6f6;
            font-size: 30px;
        }
    </style>
</head>
<body>
<div class="container">
    <div class="box-a">我是a</div>
    <div class="box-b">我是b</div>
</div>
</body>
</html>

现在用的是 flex 布局

现在a在左边, b在右边。

我想实现, b在左边, a在右边。 ps: 不能改变div顺序。 我就想知道有没有属性可以调换顺序的。

阅读 4k
3 个回答
.container {
    flex-direction:row-reverse;
}

参考

子元素加order属性或者改flex-direction

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题