HTML(18)——浮动
在HTML中，浮动（Floats）是一种CSS布局特性，用于创建多列布局。浮动可以设置为左对齐（float: left;）或右对齐（float: right;）。当一个元素浮动之后，其他内容会围绕它排列，就像它不存在一样。
以下是一个简单的HTML和CSS代码示例，展示了如何使用浮动来创建一个多列布局：
<!DOCTYPE html>
<html>
<head>
<style>
.column {
float: left;
width: 50%;
}
.row::after {
content: "";
display: table;
clear: both;
}
</style>
</head>
<body>
<div class="row">
<div class="column">
<p>这是第一列的内容。</p>
</div>
<div class="column">
<p>这是第二列的内容。</p>
</div>
</div>
</body>
</html>在这个例子中，.column 类使得 <div> 元素浮动。.row::after 伪元素用于清除浮动，以防止浮动影响其他元素的布局。使用 clear: both; 可以确保后续的元素不会与浮动的元素重叠。
评论已关闭