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

    左浮动 css怎么写

    anonymityanonymity2019-05-28 10:19:21原创4972
    Css样式的float浮动属性,用于设置标签对象(如:<div>标签盒子、<span>标签、<a>标签、<em>标签等html标签)的浮动布局,浮动也就是我们所说标签对象浮动居左靠左(float:left)和浮动居右靠右(float:right)。

    大前端成长进阶课程:进入学习

    float是什么意思?

    float是浮动,翻译成中文也是浮动意思。

    float的作用

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

    Float常跟属性值left、right、none

    Float:none 不使用浮动

    Float:left 靠左浮动

    Float:right 靠右浮动

    float语法:

    float : none | left |right

    参数值:

    none :  对象不浮动

    left :  对象浮在左边

    right :  对象浮在右边

    案例:

    我们设置一个盒子里,一个靠右、一个靠左浮动2个盒子,为了直观看到css浮动布局效果,我们对两个盒子设置一定宽度、高度和边框。

    1、主要的html代码片段:

    <div class="divcss5"> 
        <div class="divcss5_left">布局靠左浮动</div> 
        <div class="divcss5_right">布局靠右浮动</div> 
        <div class="clear"></div><!-- html注释:清除float产生浮动 --> 
    </div>
    2、css代码片段:
    .divcss5{ width:400px;padding:10px;border:1px solid #F00} 
    .divcss5_left{ float:left;width:150px;border:1px solid #00F;height:50px} 
    .divcss5_right{ float:right;width:150px;border:1px solid #00F;height:50px} 
    .clear{ clear:both}

    以上就是左浮动 css怎么写的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。

    前端(VUE)零基础到就业课程:点击学习

    清晰的学习路线+老师随时辅导答疑

    自己动手写 PHP MVC 框架:点击学习

    快速了解MVC架构、了解框架底层运行原理

    专题推荐:css
    上一篇:css hanging-punctuation属性怎么用 下一篇:自己动手写 PHP MVC 框架(40节精讲/巨细/新人进阶必看)

    相关文章推荐

    • ❤️‍🔥共22门课程,总价3725元,会员免费学• ❤️‍🔥接口自动化测试不想写代码?• css text-align属性怎么用• css全局样式有什么意义• css外部样式表怎么写• dw怎么创建css文件
    1/1

    PHP中文网