html - 将文本环绕在 div 周围

Question

如何让 div 2 环绕 div 1 ？

（两个 div 都包含文本）

+---++------------------+
|   ||                  |
| 1 ||                  |
|   ||          2       |
+---+|                  |
+----                   |
|                       |
+-----------------------

Answer 1

浮动 div 1：演示

CSS：

#d1 {
  float: left;
}

HTML：

<div id="d1">Hello world. Hello world. Hello world. </div>
<div id="d2">
  Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing. Testing.
</div>

Answer 2

嵌套 div，将它们向左浮动并为内部 div 应用尺寸样式。这是一个演示： http: //jsfiddle.net/njmWS/：

HTML：

<div>
    <div>
        <div>
            Hello
        </div>
        My name is abraham lincoln
    </div>
    And I hunt vampires
</div>

CSS：

div{
    float:left;
    background-color:gray;
    color:white;
    height:200px;
    width:300px;
}
div > div{
    background-color:blue;
    height:100px;
    width:50%;
}
div > div > div{
    background-color:red;
    height:50px;
    width:70%;
}

Answer 3

CSS，对吧？尝试分层你的 div，看看你想出了什么。从您的图表中，将 div 2 改为 div 1，以便它是更大的空间，因此另一个 div 将适合它。