float 属性将元素浮动在页面中，与相邻元素并排显示，不会影响常规流式布局。float 值为：left（左浮动）、right（右浮动）、none（清除浮动）。浮动元素影响内容溢出、间距和父容器高度。清除浮动的方法包括：清除属性、浮动元素、overflow: hidden。
CSS 中 float 的用法
float 定义
CSS 中的 float 属性将元素定位在它的内容盒之外，使其浮动在页面中。浮动元素不会影响其他元素的常规流式布局，而是与其相邻的元素并排显示。
float 值
立即学习“前端免费学习笔记（深入）”；
float 属性可以接受以下值：
用法
要浮动元素，请将 float 属性添加到其样式中：
<code class="css">element {
float: left;
}</code>影响
浮动元素会影响其附近的元素：
清除浮动
要清除浮动，可以使用以下方法之一：
实例
下面的代码创建一个带有两个浮动元素的容器：
<code class="html"><div class="container"> <div class="element1">元素 1</div> <div class="element2">元素 2</div> </div></code>
<code class="css">.container {
display: flex;
}
.element1 {
float: left;
background: red;
width: 100px;
}
.element2 {
float: right;
background: blue;
width: 100px;
}</code>输出：
<code>元素 1 | 元素 2</code>
以上就是css中float的用法的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
广告Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
244
收藏
