zoukankan      html  css  js  c++  java
  • CSS框模型以及maigin、border、padding属性

    一、框模型(Box Model)

        在CSS中所有元素都是框,都有高度(height)、宽度(width)、内边距(padding)、边框(border)、外边距(margin)等属性。框模型规定了元素框处理元素内容、内边距、边框和外边距的方式。

        元素框的最内部分是实际内容,向外依次是内边距、边框和外边距。外边距默认是透明的,因此不会遮挡其后的任何元素。内边距、边框和外边距都是可选的,默认值是0。

        注意:背景应用于内容和内边距、边框组成的区域

        在CSS中,width和height指的是内容区域的宽度和高度。增加内边距、边框和外边距不会影响内容区域的尺寸,但是会增加元素框的总尺寸。

        元素框的高 = Height + padding-top + padding-bottom +margin-top + margin-bottom;

        元素框的宽 = width + padding-left + padding-right + margin-left + margin-right;

        注意:内边距、边框和外边距可以应用于一个元素的所有边,也可以应用于单独的边。

                外边距可以是负值,内边距不允许是负值

    二、外边距合并

        外边距合并(叠加),指当两个垂直外边距相遇时,它们将形成一个外边距。合并后外边距的高度,等于发生合并的外边距的高度中的较大者。

        注意:只有普通文档流中块框的垂直外边距才会发生外边距合并。行内框、浮动框或绝对定位之间的外边距不会合并。

        外边距合并详细信息见:链接

  • 相关阅读:
    排名第一、第二的OCR软件
    补码输出
    枚举 与 枚举的应用
    动态构造结构体数组
    c 冒泡排序
    strcpy
    typedef用法
    C 结构体小结
    int 占一个机器字长
    SQL Server创建视图——视图的作用
  • 原文地址:https://www.cnblogs.com/haidaojiege/p/6798745.html
Copyright © 2011-2022 走看看