Html 负利润和源订单

我有一个关于负利润的问题。我一直在读这本关于网页设计的书，书中有一个使用浮动和负边距来改变源代码顺序的例子，但是当我尝试这样做时，它似乎不能正常工作

因此，给定这段HTML和CSS代码，如何仅使用浮点和正/负边距来交换div1和div2的位置？我知道还有很多其他的方法，但这件事困扰着我，我想弄清楚

.div1和.div2都应该保持浮动：左

正文{
背景：#222；
}
h1{
文本对齐：居中；
边框底部：1件纯色海军蓝；
}
.包装纸{
宽度：960px；
保证金：0自动；
轮廓：2倍黄色虚线；
}
.页脚{
明确：两者皆有；
背景：黑色；
颜色：白色；
文本对齐：居中；
}
.div1、.div2{
浮动：左；
背景：橙色；
}
.1分部{
宽度：480px；
}
.第2分部{
宽度：480px；
}

标题1
Lorem ipsum dolor sit amet，奉献精英。使用口罩的口罩别名为面部刺痛术、暂时性驱虫剂和软组织盲板。
Lorem ipsum dolor sit amet，奉献精英。使用口罩的口罩别名为面部刺痛术、暂时性驱虫剂和软组织盲板。
Lorem ipsum dolor sit amet，奉献精英。使用口罩的口罩别名为面部刺痛术、暂时性驱虫剂和软组织盲板。
Lorem ipsum dolor sit amet，奉献精英。使用口罩的口罩别名为面部刺痛术、暂时性驱虫剂和软组织盲板。
标题2
Lorem ipsum dolor sit amet，奉献精英。使用口罩的口罩别名为面部刺痛术、暂时性驱虫剂和软组织盲板。
Lorem ipsum dolor sit amet，奉献精英。使用口罩的口罩别名为面部刺痛术、暂时性驱虫剂和软组织盲板。
Lorem ipsum dolor sit amet，奉献精英。使用口罩的口罩别名为面部刺痛术、暂时性驱虫剂和软组织盲板。
页脚

在这种情况下，即使没有（负）边距，您也可以切换

div的

改变这个

.div1, .div2 {
    float: left;
    background: orange;
 }

到

加上你的彩车

.div1 {
   float: right;
   width: 480px;
}

.div2 {
    float: left;
    width: 480px;
 }

元素水平浮动，这意味着元素只能向左或向右浮动，不能向上或向下浮动

浮动图元将尽可能向左或向右移动。通常这意味着一直到包含元素的左侧或右侧

编辑
如果你想让两个div都向左浮动，你可以用这个。我不推荐它，因为它可能会在brwosers中变得非常混乱

.div1, .div2 {
   float: left;
   background: orange;
   position:relative;
}

.div1 {
  width: 480px;
  margin-left:480px
}

.div2 {
   width: 480px;
   margin-left:480px
   z-index:999;
   margin-top:-335px; 
} 

这样做：

.div1, .div2 {
 float: left;
 background: orange; /* Kill this float to avoid conflict */
}

.div1 {
 width: 480px;
 /* Float to the position you want by adding float property and value */
}

.div2 {
 width: 480px;
/* Float to the position you want by adding float property and value */
}

现在你会有这样的东西

.div1, .div2 {
 background: orange;
}

.div1 {
 width: 480px;
 float: right;
}

.div2 {
 width: 480px;
 foat: left:
}

---

注意：除非需要重叠，否则不要使用负边距值来定位元素。负值边距可能导致给定位置重叠

@user3139096我编辑了我的答案，所以两个div都向左浮动

.div1, .div2 {
 background: orange;
}

.div1 {
 width: 480px;
 float: right;
}

.div2 {
 width: 480px;
 foat: left:
}