css float 浮动属性使用方法和实例讲解

2019-10-25 11:27:55 织梦安装使用
  • 文章介绍

Css的float浮动属性,用于设置标签对象(如:

标签盒子、标签、标签、标签等html标签)的浮动布局,浮动也就是我们所说标签对象浮动居左靠左(float:left)和浮动居右靠右(float:right)。

float是什么意思?float是浮动,翻译成中文也是浮动意思。进入对应css手册中float手册了解float基本信息。

float的作用:通过css定义float(浮动)让div样式层块,向左或向右(靠)浮动。

 

一、float语法 

float : none | left |right

参数值: 
none :  对象不浮动
left :  对象浮在左边
right :  对象浮在右边

接下来我们来通过一实例讲解float使用技巧。

 

二、float应用与用法

Float浮动用于设置对象靠左与靠右浮动样式,可以实现我们所需要的让DIV、SPAN等标签居左居右浮动。

简单使用语法

div{float:left}/*css注释:设置div对象浮动靠左(left)*/

div{float:right}/*css注释:设置div对象浮动靠右(right)*/

 

三、css float浮动案例

创建一个水平菜单

使用浮动来创建水平菜单的超链接列表。









在线运行

 

四、css浮动总结 

我们要区别与文字内容靠左( text-align:left)靠右( text-align:right)样式,浮动只针对html标签设置靠左靠右浮动样式。float浮动样式没有靠中(浮动居中)的样式,如果需要让标签对象居中我们在css布局居中相关文字给大家详细讲解介绍(css margin)。这里记住浮动靠右使用float:right,浮动靠左使用float:left样式即可。

 

相关阅读:

CSS 教程

CSS3 教程

CSS 参考手册

上一篇:css margin外边距使用实例分析..

下一篇:CSS控制文本超出指定宽度后用省略号..

专业的织梦模板定制下载站,在线购买后即可下载!

商业源码

跟版网模板,累计帮助5000+客户企业成功建站,为草根创业提供助力!

立刻开启你的建站之旅