• 技术文章 >web前端 >css教程

    float在css是什么意思

    长期闲置长期闲置2021-12-22 16:48:35原创1196

    在css中float的意思是“浮动”,float属性用于定义元素的浮动方向,当元素设置了float属性时,元素就会浮动在其他元素上,它会根据属性值向左、向右或者不浮动,语法为“元素{float:value;}”。

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

    float在css是什么意思

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

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

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

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

    示例如下:

    <html>
    <head>
    <style type="text/css">
    img 
    {
    float:right
    }
    </style>
    </head>
    <body>
    <p>在下面的段落中,我们添加了一个样式为 <b>float:right</b> 的图像。结果是这个图像会浮动到段落的右侧。</p>
    <p>
    <img src="/i/eg_cute.gif" />
    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.
    </p>
    </body>
    </html>

    输出结果:

    10.png

    (学习视频分享:css视频教程

    以上就是float在css是什么意思的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:css
    上一篇:css中collapse是什么意思 下一篇:深入浅析了解CSS中定位布局的细节
    千万级数据并发解决方案

    相关文章推荐

    • css3的伪类和伪元素的区别是什么• css3背景怎么实现线性渐变• css3向左偏移是什么样式• css中::before是什么意思• css动画中倾斜代码是什么
    1/1

    PHP中文网