在我的示例中有两个 div,我只是希望第一个 div 在第二个 div 之后使用 css 让我们假设下面的示例
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div class="div1" >
This is first div.
</div>
<div class="div2" >
This is second div.
</div>
</body>
</html>Run Code Online (Sandbox Code Playgroud)
上面的代码给出如下输出
这是第一个 div。
这是第二个div。
但我想要的输出应该是
这是第二个div。
这是第一个 div。
不要使用 margin top:20px 因为 mycase 中的文本会比示例中的大。
以下都是纯 CSS,支持任意数量的项目,无需更改显示属性。
body {
display:flex;
flex-flow: column;
}
.div1 {
order:2;
}
.div2 {
order:1;
}
Run Code Online (Sandbox Code Playgroud)
或者,反转 Y 比例:
body {
-webkit-transform: scaleY(-1);
transform: scaleY(-1);
}
div {
-webkit-transform: scaleY(-1);
transform: scaleY(-1);
}
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
3167 次 |
| 最近记录: |