css - 使用 css 改变 HTML 元素的顺序

Question

如果以下事物有特定名称，请告诉我，以便我可以进行一些适当的研究（到目前为止，我的搜索结果是 z 索引完全不同的事物）。

好吧，考虑以下情况。你有：

<div class="foo">Foo</div>
<div class="bar">bar</div>

假设类是在 css 表中定义的，因此当您添加另一个 css 表时，它们会发生变化。

对于字体、颜色等属性，我很清楚。

问题是如何修改他们的立场。考虑一下我想要以下输出：（您只能更改 css）'Foo' 排在第二位，'bar' 排在第一位。'foo' 和 'bar' 在一行。

PS：如果有一个特定的名称（用css样式改变位置）请告诉我。

score 2 · Accepted Answer

无法通过 css 更改索引，您可以设置它们的样式：

像

.foo{ position: relative; top: 20px;}
.bar{ position: relative; top: -20px;}

您还可以使用以下示例的包装器来完成更多操作：

score 1 · Accepted Answer

您有几个选项可以使用 css 定位 div。

position是其中之一。

对于更灵活的解决方案，您还可以使用float.

在正确的分配上满足您的任何需求float:right;

无论您需要在左侧分配什么float:left;

演示

score 0 · Accepted Answer

尝试根据需要使用 top、left、bottom、right 操作位置 css 属性。如果你想让它们水平一个接一个，你可以试试 float:left

score 0 · Accepted Answer

是的，您必须使用 css 浮点数来实现它。

浮动只是将元素推到指定的方向并根据可用空间堆叠。

要获得结果，您需要应用它，

.foo, .bar { float: right; }

确保将这些标签包装在父元素中并将其设置为内联块，否则它们将浮动到完整块的末尾

4 回答 4