Question

如何让div 2环绕div 1？

（两个div都包含文字）

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

Answer 1

Float div 1：Demo

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因此适合它。

在div周围包装文本

3 个答案: