欢迎光临杨雨的个人博客站!

杨雨个人网站-杨雨个人博客-杨照佳

杨雨个人博客网站

关注互联网和搜索引擎的个人博客网站

首页 > WEB开发 > css3案例分享 >

Css中的float属性的一些使用方法

发布时间:2019-05-24  编辑:杨雨个人博客网站   点击:   

本篇文章给大家带来的内容是关于Css中的float属性的一些使用方法,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

timg.jpg

在CSS浮动中,元素浮动后将自动转为块级元素,可以移动到当前行的左侧或右侧,切记没有浮动到中间的概念,所以记住只会浮动到两侧。

float:left

float:right

float:none

浮动元素一定要设置宽度,否则后果不可预计——除了图片,因为它们有隐含的宽度。

5个特殊之处:

1、它会尽可能的水平填充容器元素,而尽量不让其他空间围绕它们。

2、浮动元素的垂直边距(margin)不会叠加,和正常的文本不同

3、浮动元素可以和临近在正常文档流中块级元素重叠(译注:浮动元素不占任何正常文档流空间,所以建议不要理解成重叠,而是腾空浮动的概念。)。”

4、多个浮动元素首先按行排列,当一行排列满了,才开始换行。

5、浮动元素不会占据正常文档的位置:(1)浮动元素之前的元素未指明位置的块级元素会占据浮动元素本来占据的位置;(2)浮动元素之后的元素会跟在浮动元素后面占据行内剩余的位置;

浮动元素之后的元素会自动围绕该浮动元素。如果你不希望这样,你可以为这些元素应用“clear属性”。该属性有4种设值:

clear: left

clear: right

clear: both

clear: none

以上就是对Css中的float属性的一些使用方法的全部介绍,如果您想了解更多有关CSS3教程,请关注PHP中文网。 本文地址:http://itbyc.com/web/css3/20049.html
转载请注明出处。

分享是一种快乐,也是一种美德:
博客首页 | WEB开发 | 网站运营 | CMS使用教程 滇ICP备14002061号-1