CSS复习之CSS盒模型

﹏ヽ暗。殇╰゛Y 2022-05-25 10:10 264阅读 0赞

今日目录

  1.     1、盒模型基本概念  
  4.     2、边框  
  7.     3、内边距  
  10.     4、外边距  
  13.     5、网页布局与盒模型

一、盒模型基本概念

70

盒模型：
相框边框 - > border
画和相框边框的距离 -> padding
相框之间的距离 -> margin

二、边框

border-width 边框宽度(粗细)
border-color 边框颜色
border-style 边框样式

70 1

三、内边距

70 2

四、外边距

70 3

五、网页布局与盒模型

70 4

六、盒子在标准流中的定位

1 ，行内元素之间的水平 margin

70 5

2 ，块级元素之间的竖直 margin

70 6

3 ，嵌套盒子之间的 margin

70 7

4 ，margin 属性可以设置成负值

70 8

添加小编微信可以获取免费资源，二维码

70 9

要用到的工具，关注 公众号直接免费获取：

70 10

发表评论

表情：
评论列表 （有 0 条评论，264人围观）

还没有评论，来说两句吧...

相关阅读

    相关 CSS之盒模型

    box-sizing盒模型的本质是一个盒子，封装周围的html元素，它包括：外边距、边框、内边距、内容。 盒模型允许我们在其他元素和周围元素边框之间的空间放置元素。 ![在

    r囧r小猫r囧r小猫/ 0 赞/ 73 阅读

    相关 CSS盒模型

    1 元素分类 在讲解CSS布局之前，我们需要提前知道一些知识，在CSS中，html中的标签元素大体被分为三种不同的类型：块状元素、内联元素(又叫行内元素)和内联块状元素。

    我就是我我就是我/ 0 赞/ 382 阅读

    相关 CSS盒模型

        盒模型是CSS布局的最基本组成部分，它指定页面元素如何显示及在某种方式上如何交互，在页面上的每个元素都是以一个矩形的表现形式存在的，每个矩形是由元素的内容、内补丁（pa

    旧城等待，旧城等待，/ 0 赞/ 338 阅读

    相关 CSS盒模型

    盒模型 单地说每个html标签都是一个方块，然后这个方块又包着几个小方块。盒模型分为IE盒模型和W3C标准盒模型两种。 Margin(外边距) - 清除边框外的区

    r囧r小猫r囧r小猫/ 0 赞/ 403 阅读

    相关 CSS盒模型

    ![img1.gif][] 我们可以把它想像成现实中上方开口的盒子，然后从正上往下俯视，边框相当于盒子的厚度，内容相对于盒子中所装物体的空间，而填充呢，相当于为防震而在盒子内

    秒速五厘米秒速五厘米/ 0 赞/ 472 阅读