十二章盒子模型下边框与外边距合并原理讲解.pdfVIP

十二章盒子模型下边框与外边距合并原理讲解.pdf

  1. 1、原创力文档(book118)网站文档一经付费(服务费),不意味着购买了该文档的版权,仅供个人/单位学习、研究之用,不得用于商业用途,未经授权,严禁复制、发行、汇编、翻译或者网络传播等,侵权必究。。
  2. 2、本站所有内容均由合作方或网友上传,本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺!文档内容仅供研究参考,付费前请自行鉴别。如您付费,意味着您自己接受本站规则且自行承担风险,本站不退款、不进行额外附加服务;查看《如何避免下载的几个坑》。如果您已付费下载过本站文档,您可以点击 这里二次下载
  3. 3、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等,请点击“版权申诉”(推荐),也可以打举报电话:400-050-0827(电话支持时间:9:00-18:30)。
  4. 4、该文档为VIP文档,如果想要下载,成为VIP会员后,下载免费。
  5. 5、成为VIP后,下载本文档将扣除1次下载权益。下载后,不支持退款、换文档。如有疑问请联系我们
  6. 6、成为VIP后,您将拥有八大权益,权益包括:VIP文档下载权益、阅读免打扰、文档格式转换、高级专利检索、专属身份标志、高级客服、多端互通、版权登记。
  7. 7、VIP文档为合作方或网友上传,每下载1次, 网站将根据用户上传文档的质量评分、类型等,对文档贡献者给予高额补贴、流量扶持。如果你也想贡献VIP文档。上传文档
查看更多

盒子模型Border边框讲解

一、边框线三要素

边框线大小边框线风格边框线颜色

三、Border边框线样式(风格)

二、边框样式值

1、none无边框border:none;

2、solid实线

3、dashed虚线

4、dotted点状

5、double双线

6、groove3D凹槽边框

7、ridge3D垄状边框

8、inset3Dinset边框

9、outset3Doutset边框

边框线颜色

三、边框线颜色

1、十六进制颜色值#CC00FF

2、英文单词中的颜色redblue

四、单独定义某个边框线样式

1、border-top顶部(上)边框线border-top:1pxsolid#CC00FF;

2、border-right右边框线样式border-right:5pxsolidred;

3、border-bottom底边框线样式border-bottom:10pxdotted#660033

4、border-left左边框线样式border-left:15pxdoubleblue;

盒子模型外边距合并原则

一、垂直方向合并

当两个垂直外边距相遇时,它们将形成一个外边距。

合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。

盒子模型外边距合并原则

二、一个元素在另一个元素里面

当一个元素包含在另一个元素中时(假设没有内边距或边框把外边距分隔开),它们的上和/或下

外边距也会发生合并。

盒子模型外边距合并原则

三、当盒子没有内容等

假设有一个空元素,它有外边距,但是没有边框或填充。在这种情况下,上外边距与下外边距就

碰到了一起,它们会发生合并:

段落元素的合并

这就是一系列的段落元素占用空间非常小的,因为它们的所有外边距都合并到一起,形成了

一个小的外边距。

盒子模型

一、盒子模型概念

宽度宽度+左内边距+右内

边距+左边框线

+右边框线+左外边距+右外

边距

高度高度+上内边距+下内

边距+上边框线

+下边框线+上外边距+下外

边距

课后预习

盒子模型下:

外边距合并原理

边框线

盒子实际大小的计算

网页制作第五期课程

文档评论(0)

lzjbook118 + 关注
实名认证
文档贡献者

该用户很懒,什么也没介绍

1亿VIP精品文档

相关文档