💎一站式轻松地调用各大LLM模型接口,支持GPT4、智谱、星火、月之暗面及文生图 广告
``` 浮动: float ``` 占CSS3 三分之一的比重 如果一个网站只有标准文档流,很多效果是不能实现的,如果要实现非标准流的页面就必须让标签去标准化,让标签脱离标准文档流的方法: 浮动和定位 浮动属性是专门用于进行网页并排布局的 作用:脱离的标准文档流,不在受元素等级限制(比如行内元素,块级,行内块)。 又可以并排显示,又可以设置宽高 flosat:属性 属性值:left,right ``` flosat:left; //左浮动 flosat:right; //右浮动 ``` 浮动特性: 元素会按照书写的顺序依次贴边 同一个父盒子既可以设置左浮动,也可以设置右浮动 所有兄弟元素,如果一个收浮动了,剩下的所有兄弟元素必须设置浮动 如果浮动元素不设置宽度,不会撑满父盒子,而被内容撑宽 代码如下: ``` .zuo{ float:left;     } .you{ float:right;     } <p class="zuo">1</p> <p class="you ">2</p> <p class="zuo">3</p> <p class="you ">4</p> <p class="zuo" >5</p> <p class="you " >6</p> <p class="zuo" >7</p> <p class="you ">8</p> <p class="zuo">9</p> <p class="you ">10</p> ``` 效果如下: ![](https://img.kancloud.cn/3b/ad/3bad1f19807cf15d42c95422d58c8388_1389x433.png)