CSS是前端开发中不可或缺的一部分，其中浮动和定位是常用的布局方式。本篇博客将详细介绍浮动和定位的概念、用法和注意事项，适合新手学习。
一、浮动
1.概念
浮动是指将元素从正常的文档流中移除，使其脱离文档流并向左或向右移动，直到其外边缘碰到包含块或另一个浮动元素的边缘为止。
2.用法
（1）float属性
float属性用于设置元素的浮动方向，可选值有left、right和none。默认值为none。
（2）clear属性
clear属性用于清除浮动，使后面的元素不再受到浮动元素的影响。可选值有left、right、both和none。默认值为none。
3.注意事项
（1）浮动元素会脱离文档流，可能会导致父元素高度塌陷，需要清除浮动。
（2）浮动元素会影响后面元素的位置，需要注意元素的顺序。
（3）浮动元素的宽度默认为内容宽度，需要设置宽度才能使其具有包裹性。
二、定位
1.概念
定位是指通过设置元素的位置属性，将元素放置在文档流之外的指定位置。
2.用法
（1）position属性
position属性用于设置元素的定位方式，可选值有static、relative、absolute和fixed。默认值为static。
（2）top、right、bottom、left属性
top、right、bottom、left属性用于设置元素相对于包含块的位置，只有在元素的position属性值为relative、absolute或fixed时才有效。
（3）z-index属性
z-index属性用于设置元素的堆叠顺序，只有在元素的position属性值为relative、absolute或fixed时才有效。
3.注意事项
（1）定位元素会脱离文档流，可能会导致父元素高度塌陷。
（2）定位元素的位置是相对于包含块而言的，需要注意包含块的设置。
（3）定位元素的堆叠顺序是根据z-index属性值的大小来确定的。
标签：浮动,定位,right,元素,文档,css,属性 From： https://www.cnblogs.com/zhangzhang001/p/17808712.html