css3中float属性怎么用

这篇文章主要介绍了css3中float属性怎么用,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。

10年积累的成都网站设计、成都做网站、外贸网站建设经验,可以快速应对客户对网站的新想法和需求。提供各种问题对应的解决方案。让选择我们的客户得到更好、更有力的网络服务。我虽然不认识你,你也不认识我。但先网站制作后付款的网站建设流程,更有沙湾免费网站建设让你可以放心的选择与我们合作。

css中,float属性用于定义元素在哪个方向浮动,语法为“元素{float:value}”;当属性的值为“left”可设置元素向左浮动;当属性的值设置为“right”可设置元素向右浮动;当属性的值设置为“none”可设置元素不浮动。

本教程操作环境:windows10系统、CSS3&&HTML5版、Dell G3电脑。

float属性定义元素在哪个方向浮动。以往这个属性总应用于图像,使文本围绕在图像周围,不过在 CSS 中,任何元素都可以浮动。浮动元素会生成一个块级框,而不论它本身是何种元素。

如果浮动非替换元素,则要指定一个明确的宽度;否则,它们会尽可能地窄。

假如在一行之上只有极少的空间可供浮动元素,那么这个元素会跳至下一行,这个过程会持续到某一行拥有足够的空间为止。

该属性的属性值如下:

css3中float属性怎么用

示例如下:




img 
{
float:right
}



在下面的段落中,我们添加了一个样式为 float:right 的图像。结果是这个图像会浮动到段落的右侧。

This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text.

输出结果:

css3中float属性怎么用

感谢你能够认真阅读完这篇文章,希望小编分享的“css3中float属性怎么用”这篇文章对大家有帮助,同时也希望大家多多支持创新互联,关注创新互联行业资讯频道,更多相关知识等着你来学习!


网站栏目:css3中float属性怎么用
网页网址:http://hbruida.cn/article/giohce.html