一尘不染

Divs的重新排序

css

如何在不更改HTML源代码的情况下重新排序div?

例如,我希望div以#div2,#div1,#div3的顺序显示,但是在HTML中它们是:

<div id="#div1"></div>  
<div id="#div2"></div>  
<div id="#div3"></div>

谢谢!


阅读 263

收藏
2020-05-16

共1个答案

一尘不染

没有使用css对元素进行重新排序的万能方法。

您可以通过将它们全部向右浮动来水平反转它们的顺序。或者,您可以将它们相对于正文或其他包含元素的绝对位置进行定位-
但这对元素的大小以及相对于页面上其他元素的位置存在严格的限制。

简短答案:您只能在非常有限的情况下实现此目标。元素的重新排序最好在标记中完成。

如果您无法控制html,则可以使用javascript。这里使用jQuery:

$("#div2").insertAfter("#div3");
$("#div1").prependTo("#div2");

我当然不建议您除非双手被绑住。这将很难维护,并且对于您的最终用户而言,它将在设置页面时使您的页面“四处走动”。

2020-05-16