0 
<div class="header">

<div class="contact half">
    <dl>
        <dt>Email</dt>
        <dd>z@srgbethet.com</dt>

        <dt>Phone</dt>
        <dd>+456 333 444</dd>

        <dt>Website</dt>
        <dd>kkkk.com</dd>
    </dl>
</div>

<div class="skills half">
    <ul>
        <li>Quantum Accelerators</li>
        <li>dfeerfbe</li>
        <li>Parachuting</li>
        <li>Photon Cannons</li>
    </ul>
</div> 
</div>

CSS 代码：

.half {
 float: left;
 width: 50%;
 }

最终的结果是接触div和技能div都很好地并排在一起。float:left既然两者都在跟踪财产，为什么它没有发生冲突？

4

2 回答 2

6

当您应用于float:left一个元素时，以下块元素将位于它的右侧（除非另有说明）。

他们都拥有的事实float:left是无关紧要的，这只是因为你的第一个元素contact half, 有float:left

在我创建的这个 jsfiddle 示例中，我half从第二个元素中删除了，它们仍然并排放置：

http://jsfiddle.net/Curt/nV5Sx/

如果您不希望他们并排坐着，您可以clear:left使用第二个元素：

http://jsfiddle.net/Curt/nV5Sx/1/

我觉得你可以通过更多地了解如何float:left工作来做。有关此样式属性的更多信息，请参阅此方便的教程：

http://css-tricks.com/all-about-floats/

于 2012-06-21T10:20:16.610 回答
1

在这里查看float 属性的定义 Float 用于水平对齐对象，因此它没有冲突。尽管您对两个元素使用了相同的类，但对于 HTML DOM 来说并不重要。

于 2012-06-21T10:20:59.490 回答