我只是想将一个 div 放在另一个旁边。我发现了两种不同的方法。你在下面有它们。但我不知道他们哪个更正确..
<html>
<head>
<style type="text/css">
.jander1{
width: 100px;
height: 100px;
float: left;
border: 5px solid;
}
</style>
</head>
<body>
<div class="jander1">jander1</div>
<div class="jander1">jander1</div>
</body>
</html>
<html>
<head>
<style type="text/css">
.jander1{
width: 100px;
height: 100px;
float: left;
border: 5px solid;
}
.jander2{
width: 100px;
height: 100px;
margin-left:100px;
border: 5px solid;
}
</style>
</head>
<body>
<div id="container">
<div class="jander1">jander1</div>
<div class="jander2">jander2</div>
</body>
</html>
贾维
最佳答案
float 两者更简单,这意味着如果您在前两个旁边添加更多元素,则不必小心。只 float 一个更不寻常,当您想要实际的 float 效果时更常使用(例如围绕 float 元素的文本环绕)。
正如 krs1 所说,您可能希望使用某种方法来清除 float 。最简单的方法是拥有一个包含元素(如第二个示例中所示),并对其应用 overflow: hidden
或 overflow: auto
。这可能会产生副作用(如果框中的内容溢出),但不会使您的标记复杂化。
#container { overflow: hidden; }
#container div { width: 100px; height: 100px; float: left; }
关于css - float 元素 : two ways of doing it, 哪个更正确?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5807842/