• 技术文章 >web前端 >前端问答

    在html中float不属于盒子属性吗

    青灯夜游青灯夜游2021-03-02 17:34:12原创591

    是的,float不属于盒子属性。盒子属性有:width、height、padding、padding-bottom、padding-left、padding-right、padding-top、margin、border等等。

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

    盒子模式(模型)就是在网页设计中经常用到的CSS技术所使用的一种思维模型。CSS假定所有的HTML文档元素都生成一个描述该元素在HTML文档布局中所占空间的矩形元素框,可以形象地将其看作是一个盒子。

    通过定义一系列与盒子相关的属性,可极大地丰富和促进各个盒子乃至整个HTML文档的表现效果和布局结构。

    css盒子模式(模型)又称为框模型 (Box Model) ,是由元素内容(content)、内边距(padding)、边框(border)、外边距(margin)几个要素组成的(如下图所示)。

    这些属性我们可以把它转移到我们日常生活中的盒子(箱子)上来理解,日常生活中所见的盒子也就是能装东西的一种箱子,也具有这些属性,所以叫它盒子模式。

    1.png

    盒子模型(Flexible Box) 属性

    1. 内容区域设定(content):

    宽度和高度的设定可以是具体的数值(带单位),也可以是百分比设置。

    2. 内边距(padding)的设定:

    属性说明
    padding使用简写属性设置在一个声明中的所有填充属性
    padding-bottom设置元素的底部填充
    padding-left设置元素的左部填充
    padding-right设置元素的右部填充
    padding-top设置元素的顶部填充

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

    3. 外边距(margin)的设定

    属性描述
    margin简写属性。在一个声明中设置所有外边距属性。
    margin-bottom设置元素的下外边距。
    margin-left设置元素的左外边距。
    margin-right设置元素的右外边距。
    margin-top设置元素的上外边距。

    4. 边框(border)的设定

    属性描述
    border简写属性,用于把针对四个边的属性设置在一个声明。
    border-style用于设置元素所有边框的样式,或者单独地为各边设置边框样式。
    border-width简写属性,用于为元素的所有边框设置宽度,或者单独地为各边边框设置宽度。
    border-color简写属性,设置元素的所有边框中可见部分的颜色,或为 4 个边分别设置颜色。
    border-bottom简写属性,用于把下边框的所有属性设置到一个声明中。
    border-bottom-color设置元素的下边框的颜色。
    border-bottom-style设置元素的下边框的样式。
    border-bottom-width设置元素的下边框的宽度。
    border-left简写属性,用于把左边框的所有属性设置到一个声明中。
    border-left-color设置元素的左边框的颜色。
    border-left-style设置元素的左边框的样式。
    border-left-width设置元素的左边框的宽度。
    border-right简写属性,用于把右边框的所有属性设置到一个声明中。
    border-right-color设置元素的右边框的颜色。
    border-right-style设置元素的右边框的样式。
    border-right-width设置元素的右边框的宽度。
    border-top简写属性,用于把上边框的所有属性设置到一个声明中。
    border-top-color设置元素的上边框的颜色。
    border-top-style设置元素的上边框的样式。
    border-top-width设置元素的上边框的宽度。

    更多编程相关知识,请访问:编程视频!!

    以上就是在html中float不属于盒子属性吗的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:html float 盒子属性
    上一篇:html水平线hr颜色怎么写 下一篇:html怎样把div放在底部
    20期PHP线上班

    相关文章推荐

    • 【活动】充值PHP中文网VIP即送云服务器• html字体颜色的设置方法• HTML button标签的属性有哪些• html怎么给文字加粗• HTML中<p>和<br>的区别是什么
    1/1

    PHP中文网