在CSS中，给class设置float属性并赋值为right（右浮动）的作用是将该元素向右浮动。这是因为浮动是CSS中一种布局方式，通过设置元素的浮动属性，可以使元素脱离正常文档流并自动向左或向右浮动到其容器的边缘。
清除浮动： --就是让当前元素左右两边都不存在浮动元素的时候，才把元素放在标准流中显示。 --清除浮动的四种方式： 使用空标记清除浮动，隔墙放。增加标签。
CSS.2中才引入浮动，当时浮动的初衷，是实现类似word里的文字环绕图片的效果。普通文档流，因为从上到下，从左到右，规定的太死了，每个元素都被限制了位置。所以才引入了浮动，形成丰富的页面效果。
float就是浮动的意思。float 属性定义元素在哪个方向浮动。以往这个属性总应用于图像，使文本围绕在图像周围，不过在 CSS 中，任何元素都可以浮动。浮动元素会生成一个块级框，而不论它本身是何种元素。
并积极做好兼容处理。解决方法：可以在包含元素内的最后一行添加一个清除元素，强制撑开包含元素，使其包含浮动元素。
CSS布局方式有很多，从远古时代的table（表格）布局--float（浮动）布局--position（定位）布局--flex（弹性）布局--grid（网格）布局（还未正式推出），下面咱们简单谈一谈各种布局的用法及其优缺点。
css实现多栏布局的几种方式假如把下面的三个p显示在同一行1231：float实现多栏布局 float属性控制目标HTML组件是否浮动以及如何浮动。设置该属性过后，对象会被当做块组件处理。
左边固定，右边自适应布局的两种实现方式效果图如下：大屏展示：小屏展示： 第一种实现方式通过负边距与浮动 实现左边固定，右边自适应的布局。
border 属性：通过设置 border 属性，可以为 元素设置边框样式、宽度和颜色。CSS布局技巧：如使用 float 属性实现多列布局、使用 flexbox 实现弹性布局、使用 grid 实现网格布局等。
1、flex：弹性；弹性布局很好的解决了float和position的问题，非常好用。使用方法：在父元素使用 display：flex；确定弹性作用的范围。
2、在 CSS 中，float：right 和 flow：right 都可以用于控制元素的布局，并将其向右对齐。但是，它们之间还是存在一些区别的。float：right：将一个元素向右浮动。在布局时，其他元素会绕过它。
3、块级布局侧重垂直方向、行内布局侧重水平方向，flex布局是与方向无关的。
4、属性值 float 是最开始出现的一种布局方式，主要解决：文本在图像周围环绕，也即应用于图像。但是在css中，任何元素都可以浮动， 浮动元素会生成一个块级框 ，而不论它本身是何种元素。
1、知道了 float 带来的不好的地方，则需要去清除浮动带来的影响。
2、在使用float属性时，如果没有正确地清除浮动，就会导致元素重叠或者显示异常的情况。一种解决方案是在父元素中使用clearfix技巧来清除子元素的浮动。另外，也可以使用flexbox等CSS布局技术来代替float属性，以避免兼容性问题。
3、内联元素使用了float属性后就会变成块级元素，就可以设置元素的高度和宽度(参考A标签)。 float属性一般配合后面标签的clear属性共同使用，以便清除float属性带来的对后面元素的影响。
4、这样的使用是正确的，大部分人都这样使用，bootstrap的栅格系统也是使用了float来实现的，并且在css3被普及之前，多列布局的最佳解决方案也是使用float？要不然你就用table。
5、由于各个浏览器在样式方面都有一些差异，还有一种情况就是，向右浮动的元素宽度不够时也会出现换行的问题，这个时候只要修改宽度就可以解决。