比方說，我有這樣的HTML頁面：CSS：移動元素，它將覆蓋HTML其位置
<body>
<p id="alice">Alice</p>
<p id="bob">Bob</p>
</body>
這種假裝的CSS語法：
p#alice:before { p#bob }
換句話說，我想使用CSS覆蓋HTML，將Bob元素放在Alice元素的上面。爲什麼？因爲在我的情況下，我可以編輯CSS，而且我無法編輯HTML。
Bob不一定真的在Alice出現在DOM之前，但它確實需要在視覺上出現在Alice上面。
這很容易但很醜，你不應該這樣做。
但是這裏是如何做到這一點：
http://jsbin.com/azevet/2/edit
<div class="first-in-dom">
Im first in DOM
</div>
<div class="second-in-dom">
Im second in DOM
</div>
div {
height:100px;
border:solid;
}
.first-in-dom, .second-in-dom {
position:relative;
}
.first-in-dom {
margin-bottom:-100px;
top:110px;
}
+1投票如果你不能使用jQuery，這可能是你最好的選擇。 – 2013-01-24 22:55:56
您可以隨時使用jQuery做，如果你能添加代碼。
$('#bob').insertBefore('#alice');
使用完全靈活的純CSS完成此操作的唯一方法是使用flexbox。
http://jsfiddle.net/S9L3r/（前綴不含稅）
body {
display: flex;
flex-flow: column nowrap;
}
#alice {
order: 2;
}
如果你知道'高度＃bob'你可以只位置'＃alice'絕對，以'＃bob'的頂部的距離身高。 – feeela
你有沒有在CSS中顯示Bob而不更改HTML流的方法，那麼當前的CSS是什麼？ – darma
你可以*用絕對或相對定位來解決這個問題......但是如果你可以編輯/添加JavaScript，那麼這將是一個更好的解決方案。 – JCOC611