css的float属性怎么用？css浮动属性float的详解

互联网 18-10-30

css中float属性在网页开发中是经常需要用到的，但是css中float属性到底怎么用呢？很多朋友可能对此比较迷糊，本篇文章就来给大家详解一下css中float属性的用法。

首先我们来简单看一下css中float属性

float属性，顾名思义就是浮动属性，设置了float属性的元素会根据属性值向左或向右浮动，我们称设置了float属性的元素为浮动元素。

用上面的话说来，感觉其实是比较抽象的，下面我们就来从css的float属性的用法来进一步了解float属性。

<!DOCTYPE html> <html> <head> <meta charset="utf-8">  <title></title> <style> img  {     float:right;/*向右*/     /*float: left;向左*/ } </style> </head> <body> <p>     <img src="image/timg.jpg" width="95" height="84" /> 好看的花好看的花好看的花好看的花好看的花好看的花好看的花好看的花好看的花 好看的花好看的花好看的花好看的花好看的花好看的花好看的花好看的花 好看的花好看的花好看的花好看的花好看的花好看的花好看的花好看的花 </p> </body> </html>

上述代码中我们给了图片一个float:right属性，导致了图片将会浮动在段落的右边，效果如下：