Html 在第一个div旁边浮动最后一个div

这是我的HTML

<div class="one">...</div>
<div class="two">...</div>
<div class="three">...</div>
<div class="four">...</div>
<div class="five">...</div>

。。。
...
...
...
...

如何仅使用CSS获取此图像？我猜是用

float

，但是我怎样才能得到第一个div旁边的第五个div呢？ 更改HTML不是（！）选项

---

您有几个选择：

浮动和负边际：

.five{float:right；页边空白顶部：-500px；}

或仅限边距

.five{margin:-500px 0 0 200px；}

或相对定位：

.five{位置：相对；顶部：-500px；左侧：200px；}

或绝对定位：

.five{位置：绝对；顶部：0；右侧：0；}

（确保容器设置为

位置：相对；

）

---

首先，带有数值的类无效。如果你不能改变他们，你就完蛋了。。。使用适当的类，解决方案可能是：

CSS:

jQuery

$("div.c5").insertBefore("div.c1")

---

看到这个

我的第一条评论是类名不能以数字开头，所以我真的希望你能编辑HTML。为了回答您的问题，忽略这个事实，如果每个元素都有一个类，这是非常简单的。只要这样做：

div { 
    float: left; 
    width: 200px;
    height: 100px;
    border: 1px solid #000;
    display: block;
    clear: left; }
div.5 { 
    float: none; 
    clear: none; 
    display: inline-block; }

---

预览：

尝试以下操作：它可以根据您的需要工作，但在水平方向，您需要垂直方向。但我相信这会对你有所帮助

#外部{
宽度：500px；
利润率：300px 0 10px；
}
.内部{
背景色：红色；
宽度：100px；
高度：100px；
浮动：左；
利润率：10px；
}

1.
2.
3.
4.
5.
6.
7.

@Wex

---

是的，我知道。这只是为了快速打字！谢谢你的回答。我可以添加CSS类，但不能更改当前值。您可以删除它。这里没关系好吧，但你为什么把它放在那里？哦，好吧，所以这里没关系？：-）谢谢，这是解决方案！请接受这个解决方案，如果它是一个你觉得答案你的问题：）我会，一个我相信它的工程为100%：-）仍然测试和微调！与Wex的答案有什么不同？

div { 
    float: left; 
    width: 200px;
    height: 100px;
    border: 1px solid #000;
    display: block;
    clear: left; }
div.5 { 
    float: none; 
    clear: none; 
    display: inline-block; }

div:last-child{
    float: none; 
    clear: none; 
    display: inline-block;
}